From 3a6c0979b205334de85de07cd376f3ed4c896c50 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=9D=A8=E9=AA=A5?= <yangji@hengshi.com>
Date: Thu, 23 Jun 2022 17:06:27 +0800
Subject: [PATCH 1/3] =?UTF-8?q?=E4=BC=98=E5=8C=96=E9=A5=BC=E5=9B=BE?=
 =?UTF-8?q?=E6=80=A7=E8=83=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/chart/pie/PieSeries.ts | 28 ++++++-------
 src/util/number.ts         | 23 +++++++++--
 test/pie-percent.html      | 83 ++++++++++++++++++++++++++++++++++++++
 test/pie3.html             |  2 +-
 4 files changed, 116 insertions(+), 20 deletions(-)
 create mode 100644 test/pie-percent.html

diff --git a/src/chart/pie/PieSeries.ts b/src/chart/pie/PieSeries.ts
index f306fafb30..fc22425605 100644
--- a/src/chart/pie/PieSeries.ts
+++ b/src/chart/pie/PieSeries.ts
@@ -20,7 +20,7 @@
 import createSeriesDataSimply from '../helper/createSeriesDataSimply';
 import * as zrUtil from 'zrender/src/core/util';
 import * as modelUtil from '../../util/model';
-import { getPercentWithPrecision } from '../../util/number';
+import { getPercentSeats } from '../../util/number';
 import { makeSeriesEncodeForNameBased } from '../../data/helper/sourceHelper';
 import LegendVisualProvider from '../../visual/LegendVisualProvider';
 import SeriesModel from '../../model/Series';
@@ -133,6 +133,8 @@ class PieSeriesModel extends SeriesModel<PieSeriesOption> {
 
     static type = 'series.pie' as const;
 
+    seats: number[];
+
     /**
      * @overwrite
      */
@@ -159,31 +161,25 @@ class PieSeriesModel extends SeriesModel<PieSeriesOption> {
      * @overwrite
      */
     getInitialData(this: PieSeriesModel): SeriesData {
-        return createSeriesDataSimply(this, {
+        const data = createSeriesDataSimply(this, {
             coordDimensions: ['value'],
             encodeDefaulter: zrUtil.curry(makeSeriesEncodeForNameBased, this)
         });
+        const valueList:number[] = [];
+        data.each(data.mapDimension('value'), function (value: number) {
+            valueList.push(value);
+        });
+
+        this.seats = getPercentSeats(valueList, data.hostModel.get('percentPrecision'));
+        return data;
     }
 
     /**
      * @overwrite
      */
     getDataParams(dataIndex: number): PieCallbackDataParams {
-        const data = this.getData();
         const params = super.getDataParams(dataIndex) as PieCallbackDataParams;
-        // FIXME toFixed?
-
-        const valueList: number[] = [];
-        data.each(data.mapDimension('value'), function (value: number) {
-            valueList.push(value);
-        });
-
-        params.percent = getPercentWithPrecision(
-            valueList,
-            dataIndex,
-            data.hostModel.get('percentPrecision')
-        );
-
+        params.percent = this.seats[dataIndex];
         params.$vars.push('percent');
         return params;
     }
diff --git a/src/util/number.ts b/src/util/number.ts
index aab32f1703..bf5b2562f0 100644
--- a/src/util/number.ts
+++ b/src/util/number.ts
@@ -233,11 +233,27 @@ export function getPercentWithPrecision(valueList: number[], idx: number, precis
         return 0;
     }
 
+    const seats = getPercentSeats(valueList, precision);
+
+    return seats[idx] || 0;
+}
+
+/**
+ * Get a data of given precision, assuring the sum of percentages
+ * in valueList is 1.
+ * The largest remainer method is used.
+ * https://en.wikipedia.org/wiki/Largest_remainder_method
+ *
+ * @param valueList a list of all data
+ * @param precision integer number showing digits of precision
+ * @return {Array<number>}
+ */
+export function getPercentSeats(valueList: number[], precision: number): number[] {
     const sum = zrUtil.reduce(valueList, function (acc, val) {
         return acc + (isNaN(val) ? 0 : val);
     }, 0);
     if (sum === 0) {
-        return 0;
+        return [];
     }
 
     const digits = Math.pow(10, precision);
@@ -275,8 +291,9 @@ export function getPercentWithPrecision(valueList: number[], idx: number, precis
         remainder[maxId] = 0;
         ++currentSum;
     }
-
-    return seats[idx] / digits;
+    return zrUtil.map(seats, function (seat) {
+        return seat / digits;
+    });
 }
 
 /**
diff --git a/test/pie-percent.html b/test/pie-percent.html
new file mode 100644
index 0000000000..9bbe0aa42f
--- /dev/null
+++ b/test/pie-percent.html
@@ -0,0 +1,83 @@
+<!DOCTYPE html>
+<!--
+Licensed to the Apache Software Foundation (ASF) under one
+or more contributor license agreements.  See the NOTICE file
+distributed with this work for additional information
+regarding copyright ownership.  The ASF licenses this file
+to you under the Apache License, Version 2.0 (the
+"License"); you may not use this file except in compliance
+with the License.  You may obtain a copy of the License at
+
+   http://www.apache.org/licenses/LICENSE-2.0
+
+Unless required by applicable law or agreed to in writing,
+software distributed under the License is distributed on an
+"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+KIND, either express or implied.  See the License for the
+specific language governing permissions and limitations
+under the License.
+-->
+
+
+<html>
+    <head>
+        <meta charset="utf-8">
+        <meta name="viewport" content="width=device-width, initial-scale=1" />
+        <script src="lib/simpleRequire.js"></script>
+        <script src="lib/config.js"></script>
+        <script src="lib/jquery.min.js"></script>
+        <script src="lib/facePrint.js"></script>
+        <script src="lib/testHelper.js"></script>
+        <!-- <script src="ut/lib/canteen.js"></script> -->
+        <link rel="stylesheet" href="lib/reset.css" />
+    </head>
+    <body>
+        <style>
+        </style>
+
+
+
+        <div id="main0"></div>
+
+
+
+
+
+
+        <script>
+        require([
+            'echarts',
+            // 'map/js/china',
+            // './data/nutrients.json'
+        ], function (echarts) {
+            var option;
+            var data = [];
+            for (var i = 0; i < 1e3; i++) {
+                data.push({
+                    name: 'test' + i,
+                    value: Math.random() * 1000,
+                });
+            }
+            option = {
+                series: {
+                    type: 'pie',
+                    data: data,
+                }
+            };
+
+            var chart = testHelper.create(echarts, 'main0', {
+                title: [
+                    'Test Pie performance'
+                ],
+                option: option
+                // height: 300,
+                // buttons: [{text: 'btn-txt', onclick: function () {}}],
+                // recordCanvas: true,
+            });
+        });
+        </script>
+
+
+    </body>
+</html>
+
diff --git a/test/pie3.html b/test/pie3.html
index e799aaae16..670e492a16 100644
--- a/test/pie3.html
+++ b/test/pie3.html
@@ -74,7 +74,7 @@
                         formatter: function (params) {
                             return '<div class="tooltip-content">\
                                 <h4>' + params.name + '</h4>\
-                                <h5>' + (params.percent * 100).toFixed(1) + '%</h5>\
+                                <h5>' + (params.percent).toFixed(1) + '%</h5>\
                                 </div><script>console.log(1111)<\/script>\
                             ';
                         },

From 77ee2a1ccb1f2bf8de7f2f9cf71b4a22deb93a09 Mon Sep 17 00:00:00 2001
From: plainheart <yhen@all-my-life.cn>
Date: Thu, 4 Aug 2022 15:51:48 +0800
Subject: [PATCH 2/3] test(pie): tweak pie-percent case - add time log,
 percentPrecision & label formatter.

---
 test/pie-percent.html | 24 ++++++++++++++++--------
 1 file changed, 16 insertions(+), 8 deletions(-)

diff --git a/test/pie-percent.html b/test/pie-percent.html
index 9bbe0aa42f..06372ba5ac 100644
--- a/test/pie-percent.html
+++ b/test/pie-percent.html
@@ -46,9 +46,7 @@
 
         <script>
         require([
-            'echarts',
-            // 'map/js/china',
-            // './data/nutrients.json'
+            'echarts'
         ], function (echarts) {
             var option;
             var data = [];
@@ -62,17 +60,27 @@
                 series: {
                     type: 'pie',
                     data: data,
+                    percentPrecision: 5,
+                    label: {
+                        formatter: '{b} {d}%'
+                    }
                 }
             };
 
             var chart = testHelper.create(echarts, 'main0', {
                 title: [
                     'Test Pie performance'
-                ],
-                option: option
-                // height: 300,
-                // buttons: [{text: 'btn-txt', onclick: function () {}}],
-                // recordCanvas: true,
+                ]
+            });
+
+            var startTs = performance.now();
+            chart.setOption(option);
+
+            chart.on('finished', function () {
+                var endTs = performance.now();
+                var time = endTs - startTs;
+                console.log('Finished in ' + time + 'ms');
+                startTs = endTs;
             });
         });
         </script>

From d2746afbaadb7130e7f8fb863b3871f254e5df57 Mon Sep 17 00:00:00 2001
From: Zhongxiang Wang <yhen@all-my-life.cn>
Date: Thu, 4 Aug 2022 16:16:06 +0800
Subject: [PATCH 3/3] test(pie): fix test case pie3.html

---
 test/pie3.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/test/pie3.html b/test/pie3.html
index 670e492a16..1f3b418b3a 100644
--- a/test/pie3.html
+++ b/test/pie3.html
@@ -74,7 +74,7 @@
                         formatter: function (params) {
                             return '<div class="tooltip-content">\
                                 <h4>' + params.name + '</h4>\
-                                <h5>' + (params.percent).toFixed(1) + '%</h5>\
+                                <h5>' + params.percent.toFixed(1) + '%</h5>\
                                 </div><script>console.log(1111)<\/script>\
                             ';
                         },
@@ -125,7 +125,7 @@ <h5>' + (params.percent).toFixed(1) + '%</h5>\
                         formatter: function (params) {
                             return '<div class="tooltip-content">\
                                 <h4>' + params.name + '</h4>\
-                                <h5>' + (params.percent * 100).toFixed(1) + '%</h5>\
+                                <h5>' + params.percent.toFixed(1) + '%</h5>\
                                 </div>\
                             ';
                         },
@@ -164,4 +164,4 @@ <h5>' + (params.percent * 100).toFixed(1) + '%</h5>\
 
         </script>
     </body>
-</html>
\ No newline at end of file
+</html>