From aeb756852abc27345a9a1a4bf455fbefdf8c75ef Mon Sep 17 00:00:00 2001
From: zyh <zhuyanheng@geedgenetworks.com>
Date: Fri, 17 Jun 2022 14:16:51 +0800
Subject: [PATCH] =?UTF-8?q?NEZ-1944=20perf=EF=BC=9A=E9=9D=A2=E7=A7=AF?=
 =?UTF-8?q?=E5=9B=BE=E6=A0=B7=E5=BC=8F=E7=BE=8E=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../src/components/chart/chartMixin.js        | 30 +++++++++++++++++++
 1 file changed, 30 insertions(+)

diff --git a/nezha-fronted/src/components/chart/chartMixin.js b/nezha-fronted/src/components/chart/chartMixin.js
index f4aa247c8..da2de93cf 100644
--- a/nezha-fronted/src/components/chart/chartMixin.js
+++ b/nezha-fronted/src/components/chart/chartMixin.js
@@ -1,4 +1,5 @@
 import lodash from 'lodash'
+import * as echarts from 'echarts'
 import { getMetricTypeValue } from '@/components/common/js/tools'
 import { getChart, getMousePoint, setChart } from '@/components/common/js/common'
 import { randomcolor } from '@/components/common/js/radomcolor/randomcolor'
@@ -40,6 +41,20 @@ export default {
     }
   },
   methods: {
+    // 十六进制转为rgba
+    hexToRgb (hex, a = 1) {
+      /*
+        hex: {String}, "#333", "#AF0382"
+      */
+      hex = hex.slice(1)
+      if (hex.length == 3) {
+        hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2]
+      }
+      const r = parseInt(hex.slice(0, 2), 16)
+      const g = parseInt(hex.slice(2, 4), 16)
+      const b = parseInt(hex.slice(4, 6), 16)
+      return `rgba(${r}, ${g}, ${b}, ${a})`
+    },
     handleTimeSeries (chartInfo, seriesTemplate, originalDatas) {
       const series = []
       let colorIndex = 0
@@ -74,6 +89,21 @@ export default {
                 }
               })
             }
+            // 判断如果是面积图 颜色设为渐变色
+            if (s.areaStyle && this.colorList.length) {
+              s.areaStyle = {
+                color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+                  {
+                    offset: 0,
+                    color: this.hexToRgb(this.colorList[colorIndex], 0.1)
+                  },
+                  {
+                    offset: 1,
+                    color: this.hexToRgb(this.colorList[colorIndex], 1)
+                  }
+                ])
+              }
+            }
             series.push(s)
             colorIndex++
           }