优化饼图性能

Author: 杨骥

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] / 100;
         params.$vars.push('percent');
         return params;
     }

src/util/number.ts

@@ -279,6 +279,63 @@ export function getPercentWithPrecision(valueList: number[], idx: number, precis
     return seats[idx] / digits;
 }
 
+/**
+ * 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>} percent ranging from 0 to 100
+ */
+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 [];
+    }
+
+    const digits = Math.pow(10, precision);
+    const votesPerQuota = zrUtil.map(valueList, function (val) {
+        return (isNaN(val) ? 0 : val) / sum * digits * 100;
+    });
+    const targetSeats = digits * 100;
+
+    const seats = zrUtil.map(votesPerQuota, function (votes) {
+        // Assign automatic seats.
+        return Math.floor(votes);
+    });
+    let currentSum = zrUtil.reduce(seats, function (acc, val) {
+        return acc + val;
+    }, 0);
+
+    const remainder = zrUtil.map(votesPerQuota, function (votes, idx) {
+        return votes - seats[idx];
+    });
+
+    // Has remainding votes.
+    while (currentSum < targetSeats) {
+        // Find next largest remainder.
+        let max = Number.NEGATIVE_INFINITY;
+        let maxId = null;
+        for (let i = 0, len = remainder.length; i < len; ++i) {
+            if (remainder[i] > max) {
+                max = remainder[i];
+                maxId = i;
+            }
+        }
+
+        // Add a vote to max remainder.
+        ++seats[maxId];
+        remainder[maxId] = 0;
+        ++currentSum;
+    }
+
+    return seats;
+}
+
 /**
  * Solve the floating point adding problem like 0.1 + 0.2 === 0.30000000000000004
  * See <http://0.30000000000000004.com/>