feat(pie): 'itemRadiusScale' function added for pie series

src/chart/pie/PieSeries.ts

@@ -54,6 +54,8 @@ interface PieItemStyleOption<TCbParams = never> extends ItemStyleOption<TCbParam
 
 export interface PieCallbackDataParams extends CallbackDataParams {
     percent: number
+    maxValue?: number
+    sum?: number
 }
 
 export interface PieStateOption<TCbParams = never> {
@@ -107,6 +109,7 @@ export interface PieSeriesOption extends
     type?: 'pie'
 
     roseType?: 'radius' | 'area'
+    itemRadiusScale?: (dataParams: PieCallbackDataParams) => number
 
     center?: string | number | (string | number)[]
 
@@ -179,12 +182,13 @@ class PieSeriesModel extends SeriesModel<PieSeriesOption> {
      */
     getDataParams(dataIndex: number): PieCallbackDataParams {
         const data = this.getData();
+        const valueDim = data.mapDimension('value');
         // update seats when data is changed
         const dataInner = innerData(data);
         let seats = dataInner.seats;
         if (!seats) {
             const valueList: number[] = [];
-            data.each(data.mapDimension('value'), function (value: number) {
+            data.each(valueDim, function (value: number) {
                 valueList.push(value);
             });
             seats = dataInner.seats = getPercentSeats(valueList, data.hostModel.get('percentPrecision'));
@@ -193,6 +197,15 @@ class PieSeriesModel extends SeriesModel<PieSeriesOption> {
         // seats may be empty when sum is 0
         params.percent = seats[dataIndex] || 0;
         params.$vars.push('percent');
+
+        const itemRadiusScale = data.hostModel.get('itemRadiusScale');
+        if (typeof itemRadiusScale === 'function') {
+            /* useful for custom percentage calculations in formatters etc. */
+            params.maxValue = data.getDataExtent(valueDim)[1];
+            params.$vars.push('maxValue');
+            params.sum = data.getSum(valueDim);
+            params.$vars.push('sum');
+        }
         return params;
     }
 

src/chart/pie/pieLayout.ts

@@ -114,6 +114,7 @@ export default function pieLayout(
         const clockwise = seriesModel.get('clockwise');
 
         const roseType = seriesModel.get('roseType');
+        const itemRadiusScale = seriesModel.get('itemRadiusScale');
         const stillShowZeroSum = seriesModel.get('stillShowZeroSum');
 
         // [0...max]
@@ -188,6 +189,19 @@ export default function pieLayout(
                 actualEndAngle = endAngle - halfPadAngle;
             }
 
+            let outerRadius = r;
+            if (typeof itemRadiusScale === 'function') {
+                // calculate the radius of the current pie item based on the scale from the user-defined function
+                let scale = itemRadiusScale(seriesModel.getDataParams(idx)) || 0;
+                // scale should always be between 0 and 1
+                scale = Math.max(0, Math.min(scale, 1));
+                // r0 is used here to scale radius properly in case of 'donut' style.
+                outerRadius = (r - r0) * scale + r0;
+            }
+            else if (roseType) {
+                outerRadius = linearMap(value, extent, [r0, r]);
+            }
+
             data.setItemLayout(idx, {
                 angle: angle,
                 startAngle: actualStartAngle,
@@ -196,9 +210,7 @@ export default function pieLayout(
                 cx: cx,
                 cy: cy,
                 r0: r0,
-                r: roseType
-                    ? linearMap(value, extent, [r0, r])
-                    : r
+                r: outerRadius
             });
 
             currentAngle = endAngle;