refactor: 颜色优化

frontend/src/views/chart/chart/bar/bar.js

@@ -25,7 +25,7 @@ export function baseBarOption(chart_option, chart) {
       const y = chart.data.series[i]
       // color
       y.itemStyle = {
-        color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha)
+        color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha)
       }
       // size
       if (customAttr.size) {
@@ -88,7 +88,7 @@ export function horizontalBarOption(chart_option, chart) {
       const y = chart.data.series[i]
       // color
       y.itemStyle = {
-        color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha)
+        color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha)
       }
       // size
       if (customAttr.size) {

frontend/src/views/chart/chart/funnel/funnel.js

@@ -40,7 +40,7 @@ export function baseFunnelOption(chart_option, chart) {
         y.name = chart.data.x[i]
         // color
         y.itemStyle = {
-          color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha)
+          color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha)
         }
         // y.type = 'funnel'
         chart_option.series[0].data.push(y)

frontend/src/views/chart/chart/gauge/gauge.js

@@ -63,7 +63,7 @@ export function baseGaugeOption(chart_option, chart) {
           for (let i = 0; i < arr.length; i++) {
             const ele = arr[i]
             const p = parseInt(ele) / 100
-            range.push([p, hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha)])
+            range.push([p, hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha)])
             if (!flag && per <= p) {
               flag = true
               index = i
@@ -73,7 +73,7 @@ export function baseGaugeOption(chart_option, chart) {
             index = arr.length
           }
 
-          range.push([1, hexColorToRGBA(customAttr.color.colors[arr.length % 9], customAttr.color.alpha)])
+          range.push([1, hexColorToRGBA(customAttr.color.colors[arr.length % customAttr.color.colors.length], customAttr.color.alpha)])
           chart_option.series[0].axisLine = {
             lineStyle: {
               color: range

frontend/src/views/chart/chart/gauge/gauge_antv.js

@@ -88,12 +88,12 @@ export function baseGaugeOptionAntV(plot, container, chart, action) {
     options.indicator = {
       pointer: {
         style: {
-          stroke: theme.styleSheet.paletteQualitative10[index % 9]
+          stroke: theme.styleSheet.paletteQualitative10[index % theme.styleSheet.paletteQualitative10.length]
         }
       },
       pin: {
         style: {
-          stroke: theme.styleSheet.paletteQualitative10[index % 9]
+          stroke: theme.styleSheet.paletteQualitative10[index % theme.styleSheet.paletteQualitative10.length]
         }
       }
     }

frontend/src/views/chart/chart/line/line.js

@@ -25,7 +25,7 @@ export function baseLineOption(chart_option, chart) {
       const y = chart.data.series[i]
       // color
       y.itemStyle = {
-        color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha)
+        color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha)
       }
       // size
       if (customAttr.size) {

frontend/src/views/chart/chart/map/map.js

@@ -73,7 +73,7 @@ export function baseMapOption(chart_option, chart) {
         y.name = chart.data.x[i]
         // color
         // y.itemStyle = {
-        //   color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha),
+        //   color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha),
         //   borderRadius: 0
         // }
         chart_option.series[0].data.push(y)

frontend/src/views/chart/chart/mix/mix.js

@@ -27,7 +27,7 @@ export function baseMixOption(chart_option, chart) {
       y.type = y.type ? y.type : 'bar'
       // color
       y.itemStyle = {
-        color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha)
+        color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha)
       }
       // size
       if (customAttr.size) {

frontend/src/views/chart/chart/mix/mix_antv.js

@@ -43,7 +43,7 @@ export function baseMixOptionAntV(plot, container, chart, action) {
     const o = {
       type: '',
       options: {
-        color: colors[i % 9],
+        color: colors[i % colors.length],
         data: d.data,
         xField: 'field',
         yField: 'value',

frontend/src/views/chart/chart/pie/pie.js

@@ -41,7 +41,7 @@ export function basePieOption(chart_option, chart) {
         y.name = chart.data.x[i]
         // color
         y.itemStyle = {
-          color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha),
+          color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha),
           borderRadius: 0
         }
         y.type = 'pie'
@@ -94,7 +94,7 @@ export function rosePieOption(chart_option, chart) {
         y.name = chart.data.x[i]
         // color
         y.itemStyle = {
-          color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha),
+          color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha),
           borderRadius: customAttr.size.pieRoseRadius
         }
         y.type = 'pie'

frontend/src/views/chart/chart/radar/radar.js

@@ -33,7 +33,7 @@ export function baseRadarOption(chart_option, chart) {
       }
       // color
       y.itemStyle = {
-        color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha)
+        color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha)
       }
       // label
       if (customAttr.label) {

frontend/src/views/chart/chart/scatter/scatter.js

@@ -30,7 +30,7 @@ export function baseScatterOption(chart_option, chart, terminal = 'pc') {
       const y = chart.data.series[i]
       // color
       y.itemStyle = {
-        color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha)
+        color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha)
       }
       // size
       if (customAttr.size) {

frontend/src/views/chart/chart/treemap/treemap.js

@@ -49,7 +49,7 @@ export function baseTreemapOption(chart_option, chart) {
         y.name = chart.data.x[i]
         // color
         y.itemStyle = {
-          color: hexColorToRGBA(customAttr.color.colors[i % 9], customAttr.color.alpha)
+          color: hexColorToRGBA(customAttr.color.colors[i % customAttr.color.colors.length], customAttr.color.alpha)
         }
         // y.type = 'treemap'
         chart_option.series[0].data.push(y)