NEZ-3211 fix： dashboard 时序图表性能优化

nezha-fronted/src/components/chart/chart/legend.vue

@@ -164,6 +164,7 @@ export default {
               echarts.setSeries(sindex, { show: false, focus: false })
             }
           })
+          echarts.setSeries(index + 1, { show: true, focus: false })
           this.isGrey = this.isGrey.map((g, i) => i !== index)
         } else if (currentIsTheOnlyOneHighlight) { // 2.全高亮
           echarts.series.forEach((seriesItem, sindex) => {

nezha-fronted/src/components/chart/chart/uplot/chartTimeSeries.vue

@@ -279,18 +279,22 @@ export default {
         getStackedOpts('', opts, data)
       }
       this.renderMinMax(opts)
-      console.log(opts)
+      if (getChart(this.chartId)) {
+        getChart(this.chartId).destroy()
+      }
       setTimeout(() => { // 延迟加载 保证legend的高度正常
         const dom = document.getElementById(`chart-canvas-${this.chartId}`)
         const width = dom.offsetWidth
         const height = dom.offsetHeight
         opts.width = width
         opts.height = height
-        const chartUplot = new UPlot(opts, data, document.getElementById(`chart-canvas-${this.chartId}`))
+        let chartUplot = ''
+        chartUplot = new UPlot(opts, data, document.getElementById(`chart-canvas-${this.chartId}`))
         setChart(this.chartId, chartUplot)
       }, 100)
     },
     renderMinMax (opts) {
+      console.log(opts)
       let leftMin = this.$lodash.get(this.chartInfo, 'param.min', undefined)
       let leftMax = this.$lodash.get(this.chartInfo, 'param.max', undefined)
       if (leftMin || leftMax) {
@@ -299,7 +303,7 @@ export default {
           leftMin = leftMax
           leftMax = temp
         }
-        opts.scales.left.range = (self, initMin, initMax, scaleKey)=>{
+        opts.scales.left.range = (self, initMin, initMax, scaleKey) => {
           if (typeof (leftMin) === 'undefined') {
             if (initMin > 0) {
               leftMin = initMin / 2
@@ -327,7 +331,7 @@ export default {
             rightMin = rightMax
             rightMax = temp
           }
-          opts.scales.right.range = (self, initMin, initMax, scaleKey)=>{
+          opts.scales.right.range = (self, initMin, initMax, scaleKey) => {
             if (typeof (rightMin) === 'undefined') {
               if (initMin > 0) {
                 rightMin = initMin / 2
@@ -420,6 +424,7 @@ export default {
           this.$refs.legend.isGrey = this.isGrey = arr
         }
       }
+      this.renderYaxis()
       this.clickout()
     },
     showSelectedSeries () {
@@ -440,10 +445,12 @@ export default {
           this.$refs.legend.isGrey = arr
         }
       }
+      this.renderYaxis()
       this.clickout()
     },
     legendChange (isGrey) {
       this.isGrey = isGrey
+      this.renderYaxis()
     },
     resize () {
       setTimeout(() => {
@@ -457,6 +464,27 @@ export default {
           u.setSize({ width, height })
         }
       }, 100)
+    },
+    renderYaxis () {
+      const u = getChart(this.chartId)
+      let leftShow = false
+      let rightShow = false
+      u.series.forEach(item => {
+        if (item.show && item.scale == 'left') {
+          leftShow = true
+        }
+        if (item.show && item.scale == 'right') {
+          rightShow = true
+        }
+      })
+      u.axes[1].show = leftShow
+      u.axes[2].show = rightShow
+      if (!leftShow) {
+        u.axes[2].grid.show = true
+      } else {
+        u.axes[2].grid.show = false
+      }
+     u.redraw(false, true)
     }
   },
   mounted () {

nezha-fronted/src/components/chart/chart/uplot/chartTimeSeriesMixin.js

@@ -32,6 +32,7 @@ export default {
   methods: {
     initSeriesData (chartData) { // 处理数据 以及 series
       let time = []
+      this.legends = []
       const seriesData = [] // 返回的数据
       const seriesAll = [ // 返回的 series
 
@@ -51,6 +52,9 @@ export default {
       })
       chartData.forEach((series, expressionIndex) => { // 首先处理时间 对应点没有值（不包括null 则添加undefind）
         series.forEach((item, seriesIndex) => {
+          if (chartIndex >= 20 && !this.showAllData) {
+            return
+          }
           let seriesObjTime = {}
           // 若需要统计，处理统计数据
           const statisticsTypes = this.chartInfo.param.legend ? this.chartInfo.param.legend.values : ''
@@ -102,7 +106,6 @@ export default {
       const obj = {
         name: name,
         label: alias,
-        class: series.elements.name + JSON.stringify(series.metric),
         scale: isRight ? 'right' : 'left', // right
         yAxisIndex: isRight ? 1 : 0, // right
         values: (u, v) => series.elements.name + JSON.stringify(series.metric),
@@ -557,7 +560,6 @@ export default {
         value: [chart.data[0][dataIdx], chart.data[seriesIdx][dataIdx]],
         seriesName: obj.label
       }
-      console.log(params)
       if (!params.seriesName) {
         return
       }

nezha-fronted/src/components/chart/chart/uplot/stack.js

@@ -28,7 +28,6 @@ function stack (data, omit) {
 
 export default function getStackedOpts (title, opt, data, interp) {
   const opts = opt
-  opt.scales = {}
   const interped = interp ? interp(data) : data
 
   const stacked = stack(interped, i => false)
@@ -55,15 +54,6 @@ export default function getStackedOpts (title, opt, data, interp) {
       }
     }
   })
-
-  // force 0 to be the sum minimum this instead of the bottom series
-  opts.scales.y = {
-    range: (u, min, max) => {
-      const minMax = uPlot.rangeNum(0, max, 0.1, true)
-      return [0, minMax[1]]
-    }
-  }
-
   // restack on toggle
   opts.hooks = {
     setSeries: [