echarts中series的动态渲染

    domesticOptions() {
         return {
            tooltip: {
               trigger: 'axis',
               formatter: function(obj) {
                  let str = '';
                  str = '<div style="font-size: 12px;"><p style="color:#fff;lineHeight:18px;height:18px;margin-bottom:10px;">' + obj[0].name + '</p>';
                  obj.map(item => {
                     const value = isNull(item.value, 2);
                     const subStr = '<div style=\'lineHeight:22px;height:24px;\'><div style=\'display:inline-block;width:5px;height:5px;margin-right:6px;background:' +
                       item.color + ';border-radius:50%;margin-bottom:2px;\'></div>' + item.seriesName + '：' + value + '</div>';
                     str += subStr;
                  });
                  str += '</div>';
                  return str;
               },
            },
            legend: {
               data: this.arrGN,
               show: true,
               icon: 'roundRect',
               itemGap: 30,
               itemWidth: 18,
               itemHeight: 8,
               bottom: '1%',
               selectedMode: false, // 防止点击曲线消失
            },
            grid: {
               left: '1%',
               right: '1%',
               top: '8%',
               bottom: '10%',
               containLabel: true,
            },
            xAxis: {
               type: 'category',
               boundaryGap: false,
               data: this.xData,
               interval: 0,
               splitLine: {
                  lineStyle: {
                     type: 'dashed',
                     color: '#BDC2C8',
                  },
               },
               axisLine: {
                  show: true,
                  lineStyle: {
                     color: '#BDC2C8',
                  },
               },
            },
            yAxis: {
               type: 'value',
               splitLine: {
                  lineStyle: {
                     type: 'dashed',
                     color: '#BDC2C8',
                  },
               },
               axisLine: {
                  show: false,
                  lineStyle: {
                     color: '#BDC2C8',
                  },
               },
            },
            series: this.series,
         };
      },

    // 获取echarts数据
      getData() {
         let obj = {};
            obj = {
               port: this.GkName == '全部' ? null : this.GkName,
               sTime: this.stime,
               eTime: this.etime,
            };
    
         api.getEchartsData(obj).then(res => {
            if(res.data != {}) {
               this.arrGN = Object.keys(res);
               const arr = [];
               arr.push(Object.values(res));
    
               for(let i = 0; i < arr[0].length; i++) {
                  for(let j = 0; j < this.xData.length; j++) {
                     const tempTime = arr[0][i].find(it => moment(it.time).format('D') == this.xData[j]);
                     this.arr1.push(tempTime ? tempTime.price : undefined);
                  }
               }
    			  //将数组中的数据通过当月天数分割成新的数组
               const result = [];
    
               for(let i = 0; i < this.arr1.length; i += this.xData.length) {
                  result.push(this.arr1.slice(i, i + this.xData.length));
               }
    			 //echarts中生成series数据
               for(let i = 0; i < this.arrGN.length; i++) {
                  this.series.push({
                     name: this.arrGN[i],
                     type: 'line',
                     symbol: 'circle', // 设定为实心点
                     symbolSize: 8, // 设定实心点的大小
                     stack: 'Total',
                     data: result[i],
                  });
               }
            }
            else {
               this.series = [];
            }
         });
      },