item style

Author: Imiss-U1025

client/packages/lowcoder-comps/src/comps/pieChartComp/pieChartUtils.ts

@@ -91,12 +91,11 @@ export function getSeriesConfig(props: EchartsConfigProps) {
         ...config,
         startAngle: s.startAngle,
         endAngle: s.endAngle,
+        padAngle: s.padAngle,
         name: s.seriesName,
         label: {
           position: s.labelPosition,
           alignTo: s.labelAlignTo,
-          bleedMargin: s.labelBleedMargin,
-          edgeDistance: s.labelEdgeDistance,
         },
         labelLine: {
           length: s.labelLineLength,
@@ -106,6 +105,12 @@ export function getSeriesConfig(props: EchartsConfigProps) {
           itemName: props.xAxisKey,
           value: s.columnName,
         },
+        itemStyle: {
+          borderRadius: s.borderRadius,
+          color: s.itemColor,
+          shadowColor: s.itemShadowColor,
+          shadowBlur: s.itemShadowBlur,
+        },
       }
       if(s.roseType !== "none") {
         config.roseType = s.roseType;

client/packages/lowcoder-comps/src/comps/pieChartComp/seriesComp.tsx

@@ -1,6 +1,7 @@
 import {
   BoolControl,
   StringControl,
+  ColorControl,
   list,
   dropdownControl,
   withDefault,
@@ -90,6 +91,11 @@ const seriesChildrenMap = {
   labelEdgeDistance: withDefault(StringControl, '25%'),
   labelLineLength: withDefault(NumberControl, 10),
   labelLineLength2: withDefault(NumberControl, 10),
+  padAngle: withDefault(NumberControl, 0),
+  borderRadius: withDefault(NumberControl, 0),
+  itemColor: ColorControl,
+  itemShadowBlur: NumberControl,
+  itemShadowColor: ColorControl,
   hide: BoolControl,
   // unique key, for sort
   dataIndex: valueComp<string>(""),
@@ -145,6 +151,21 @@ class SeriesComp extends SeriesTmpComp {
         {this.children.labelAlignTo.getView() === "labelLine" && this.children.labelLineLength2.propertyView({
           label: trans("pieChart.labelLineLength2"),
         })}
+        {this.children.padAngle.propertyView({
+          label: trans("pieChart.padAngle"),
+        })}
+        {this.children.borderRadius.propertyView({
+          label: trans("pieChart.borderRadius"),
+        })}
+        {this.children.itemColor.propertyView({
+          label: trans("pieChart.itemColor"),
+        })}
+        {this.children.itemShadowBlur.propertyView({
+          label: trans("pieChart.itemShadowBlur"),
+        })}
+        {this.children.itemShadowColor.propertyView({
+          label: trans("pieChart.itemShadowColor"),
+        })}
       </>
     );
   }

client/packages/lowcoder-comps/src/i18n/comps/locales/en.ts

@@ -348,6 +348,11 @@ export const en = {
     borderType: "Border Type",
   },
   pieChart: {
+    itemColor: "Color",
+    itemShadowColor: "Shadow Color",
+    itemShadowBlur: "Shadow Blur",
+    padAngle: "Pad Angle",
+    borderRadius: "Border Radius",
     startAngle: "Start Angle",
     endAngle: "End Angle",
     roseType: "Rose Type",