From cfa21fb1a5ba8b30a35259aedf4be2c993776092 Mon Sep 17 00:00:00 2001
From: ulleo <ulleo.wang@gmail.com>
Date: Tue, 30 Apr 2024 16:39:35 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=9B=BE=E8=A1=A8):=20=E5=8F=8C=E8=BD=B4?=
 =?UTF-8?q?=E5=9B=BE=E5=A2=9E=E5=8A=A0=E6=B8=90=E5=8F=98=E8=89=B2=E9=85=8D?=
 =?UTF-8?q?=E7=BD=AE?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../panel/charts/others/chart-mix-common.ts   |  1 +
 .../js/panel/charts/others/chart-mix.ts       | 28 +++++++++++++++----
 2 files changed, 24 insertions(+), 5 deletions(-)

diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix-common.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix-common.ts
index c7bdb86726..afca7d9f24 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix-common.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix-common.ts
@@ -19,6 +19,7 @@ export const CHART_MIX_EDITOR_PROPERTY_INNER: EditorPropertyInner = {
   'basic-style-selector': [
     'colors',
     'alpha',
+    'gradient',
     'lineWidth',
     'lineSymbol',
     'lineSymbolSize',
diff --git a/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix.ts b/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix.ts
index e901e99992..83bf2cb246 100644
--- a/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix.ts
+++ b/core/core-frontend/src/views/chart/components/js/panel/charts/others/chart-mix.ts
@@ -3,7 +3,14 @@ import {
   G2PlotDrawOptions
 } from '@/views/chart/components/js/panel/types/impl/g2plot'
 import { DualAxes, DualAxesOptions } from '@antv/g2plot/esm/plots/dual-axes'
-import { getAnalyse, getLabel, getPadding, getYAxis, getYAxisExt } from '../../common/common_antv'
+import {
+  getAnalyse,
+  getLabel,
+  getPadding,
+  getYAxis,
+  getYAxisExt,
+  setGradientColor
+} from '../../common/common_antv'
 import { flow, hexColorToRGBA, parseJson } from '@/views/chart/components/js/util'
 import { cloneDeep, isEmpty, defaultTo, map, filter } from 'lodash-es'
 import { valueFormatter } from '@/views/chart/components/js/formatter'
@@ -63,20 +70,31 @@ export class ColumnLineMix extends G2PlotChartView<DualAxesOptions, DualAxes> {
     })
     // custom color
     const customAttr = parseJson(chart.customAttr)
-    const color = customAttr.basicStyle.colors
+    let color = customAttr.basicStyle.colors
+
+    color = color.map(ele => {
+      const tmp = hexColorToRGBA(ele, customAttr.basicStyle.alpha)
+      if (customAttr.basicStyle.gradient) {
+        return setGradientColor(tmp, true, 270)
+      } else {
+        return tmp
+      }
+    })
+
     // options
     const initOptions: DualAxesOptions = {
       data: [data1, data2],
       xField: 'field',
       yField: ['value', 'valueExt'], //这里不能设置成一样的
       appendPadding: getPadding(chart),
-      color,
       geometryOptions: [
         {
-          geometry: data1Type
+          geometry: data1Type,
+          color: color[0]
         },
         {
-          geometry: data2Type
+          geometry: data2Type,
+          color: color[1]
         }
       ],
       interactions: [