update

src/components/common/echartCard/echartsOptions.ts

@@ -243,48 +243,49 @@ const barChart = (
     option.color = color;
   }
   // 配置series
-  const len = series?.length ?? 0;
-  option.series =
-    series?.map((item: any) => {
-      // 设置type
-      if (!Reflect.has(item, 'type')) {
-        item.type = 'bar';
-      }
-      // 设置柱子宽度
-      item.barMaxWidth = '24px';
-      // if (!Reflect.has(item, 'barMaxWidth')) {
-      //   item.barMaxWidth = '30px';
-      // }
-      // 1、柱子之间的距离
-      item.barGap = '0';
-      // 2、堆叠柱子宽度
-      // if (item.stack === 'total') {
-      //   item.barMaxWidth = '30px';
-      // }
-      // 3、多个并列柱子 增加背景颜色
-      if (len > 1 && item.stack !== 'total') {
-        item.showBackground = true;
-        item.backgroundStyle = {
-          color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-            {
-              offset: 0,
-              color: 'rgba(160, 207, 255, 0.18)',
-            },
-            {
-              offset: 1,
-              color: 'rgba(160, 207, 255, 0.05)',
-            },
-          ]),
-        };
-      } else {
-        item.showBackground = false;
-      }
-      return item;
-    }) ?? [];
+  const filteredSeries = (series || []).filter(Boolean);
+  const len = filteredSeries.length;
+  option.series = filteredSeries.map((item: any) => {
+    // 设置type
+    if (!Reflect.has(item, 'type')) {
+      item.type = 'bar';
+    }
+    // 设置柱子宽度
+    item.barMaxWidth = '24px';
+    // if (!Reflect.has(item, 'barMaxWidth')) {
+    //   item.barMaxWidth = '30px';
+    // }
+    // 1、柱子之间的距离
+    item.barGap = '0';
+    // 2、堆叠柱子宽度
+    // if (item.stack === 'total') {
+    //   item.barMaxWidth = '30px';
+    // }
+    // 3、多个并列柱子 增加背景颜色
+    if (len > 1 && item.stack !== 'total') {
+      item.showBackground = true;
+      item.backgroundStyle = {
+        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+          {
+            offset: 0,
+            color: 'rgba(160, 207, 255, 0.18)',
+          },
+          {
+            offset: 1,
+            color: 'rgba(160, 207, 255, 0.05)',
+          },
+        ]),
+      };
+    } else {
+      item.showBackground = false;
+    }
+    return item;
+  });
   if (option) {
     myChart[id].setOption(option);
   }
 };
+
 const pieChart = (
   id: string,
   { series, color, title, tooltip, legend, grid }: any,
@@ -367,44 +368,44 @@ const pieChart = (
     }
   }
 
-  option.series =
-    series.map((item: any) => {
-      const seriesObj = {
-        name: item.name,
-        type: 'pie',
-        radius: item.radius || ['40%', '70%'],
-        center: item.center ? item.center : ['50%', '60%'],
-        avoidLabelOverlap: false,
-        itemStyle: item.itemStyle || {
-          borderRadius: 5,
-          borderColor: commonEchartColor[isDark ? 'dark' : 'light'].tooltipBgColor,
-          borderWidth: 2,
+  option.series = (series || []).filter(Boolean).map((item: any) => {
+    const seriesObj = {
+      name: item.name || '',
+      type: 'pie',
+      radius: item.radius || ['40%', '70%'],
+      center: item.center ? item.center : ['50%', '60%'],
+      avoidLabelOverlap: false,
+      itemStyle: item.itemStyle || {
+        borderRadius: 5,
+        borderColor: commonEchartColor[isDark ? 'dark' : 'light'].tooltipBgColor,
+        borderWidth: 2,
+      },
+      label: item.label || {
+        show: false,
+        position: 'center',
+      },
+      emphasis: item.emphasis || {
+        label: {
+          show: true,
+          fontSize: 40,
+          fontWeight: 'bold',
         },
-        label: item.label || {
-          show: false,
-          position: 'center',
-        },
-        emphasis: item.emphasis || {
-          label: {
-            show: true,
-            fontSize: 40,
-            fontWeight: 'bold',
-          },
-        },
-        labelLine: item.labelLine || {
-          show: false,
-        },
-        data: item.data,
-      };
-      if (!Reflect.has(item, 'type')) {
-        seriesObj.type = 'pie';
-      }
-      return seriesObj;
-    }) ?? [];
+      },
+      labelLine: item.labelLine || {
+        show: false,
+      },
+      data: item.data || [],
+    };
+    if (!Reflect.has(item, 'type')) {
+      seriesObj.type = 'pie';
+    }
+    return seriesObj;
+  });
   if (option) {
     myChart[id].setOption(option);
   }
 };
+
 const lineChart = (
   id: string,
   { title, tooltip, legend, grid, xAxis, yAxis, series, color, dataZoom, zoomShowNum = 5 }: any,
@@ -490,13 +491,12 @@ const lineChart = (
   if (color) {
     option.color = color;
   }
-  option.series =
-    series.map((item: any) => {
-      if (!Reflect.has(item, 'type')) {
-        item.type = 'line';
-      }
-      return item;
-    }) ?? [];
+  option.series = (series || []).filter(Boolean).map((item: any) => {
+    if (!Reflect.has(item, 'type')) {
+      item.type = 'line';
+    }
+    return item;
+  });
   if (option) {
     myChart[id].setOption(option);
   }