<template>
  <div style="width: 100%;height: 100%">
    <div id="fpcharts"></div>
  </div>
</template>

<script>
import resize from '../../../../components/Charts/mixins/resize'
import echarts from 'echarts'
import cc from '../../../curvecolors'

export default {
  mixins: [resize],
  watch: {
    drawData: {
      handler(newValue, oldValue) {
        this.draw(newValue)

      },
      deep: true
    },
    resizeKey: function (newQuestion, oldQuestion) {
      if (this.chart != null) {
        this.chart.resize();
      }

    }
  },
  props: {
    drawData: {
      type: Object,
    },
    resizeKey: {
      type: Number
    }
  },
  data() {
    return {
      lineColor: '',
      chart: null,
    }
  },
  mounted() {
    if(sessionStorage.getItem('styleSwitch') === 'blue'){
      this.lineColor = 'white'
    }else{
      this.lineColor = '#3b3b3b'
    }
  },
  // beforeDestroy() {
  //   if (!this.chart) {
  //     alert(11)
  //     return
  //   }
  //   alert(22)
  //   this.chart.dispose()
  //   this.chart = null
  // },
  methods: {

    draw(newValue) {
      var minValue = 0
      this.chart = echarts.init(document.getElementById('fpcharts'))
      var option = {
        backgroundColor: 'transparent',
        title: {
          top: 20,
          text: '对比数据查询',
          textStyle: {
            fontWeight: 'normal',
            fontSize: 16,
            color: this.lineColor
          },
          left: '1%'
        },
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            lineStyle: {
              color: '#57617B'
            }
          }
        },
        legend: {
          top: 20,
          icon: 'rect',
          itemWidth: 14,
          itemHeight: 5,
          itemGap: 13,
          data: [],
          right: '4%',
          textStyle: {
            fontSize: 12,
            color: this.lineColor
          }
        },
        dataZoom: [{
          show: true,
          realtime: true,
          start: 0,
          end: 100,
          left: "15%",
          right: "15%",
          textStyle: {
            color: this.lineColor
          }
        }, {
          type: 'inside'
        }],
        grid: {
          top: 100,
          left: '2%',
          right: '2%',
          bottom: '10%',
          containLabel: true
        },
        xAxis: [{
          type: 'category',
          boundaryGap: false,
          axisLine: {
            lineStyle: {
              color: this.lineColor
            }
          },
          data: newValue.times
        }],
        yAxis: [{
          type: 'value',
          name: '(MW)',
          max: newValue.electricField.capacity,
          min: 0,
          axisTick: {
            show: false
          },
          axisLine: {
            lineStyle: {
              color: this.lineColor
            }
          },
          axisLabel: {
            margin: 10,
            textStyle: {
              fontSize: 14
            }
          },
          splitLine: {
            lineStyle: {
              color: '#57617B'
            }
          }
        }],
        series: []
      }

      if (newValue.electricField.electricFieldTypeEnum == "E1") {
        option.yAxis.push({
          type: 'value',
          name: '(W/㎡)',
          min: 0,
          axisTick: {
            show: false
          },
          axisLine: {
            lineStyle: {
              color: '#ffe599'
            }
          },
          axisLabel: {
            margin: 10,
            textStyle: {
              fontSize: 14
            }
          },
          splitLine: {
            lineStyle: {
              color: '#57617B'
            }
          }
        })
      } else {
        option.yAxis.push({
          type: 'value',
          name: '(m/s)',
          min: 0,
          axisTick: {
            show: false
          },
          axisLine: {
            lineStyle: {
              color: '#fff2cc'
            }
          },
          axisLabel: {
            margin: 10,
            textStyle: {
              fontSize: 14
            }
          },
          splitLine: {
            lineStyle: {
              color: '#666633'
            }
          }
        })
      }


      if (newValue.realValue.length > 0) {
        option.series.push({
          name: '实际功率',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.sj,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.realValue
        })
        option.legend.data.push('实际功率')
      }


      if (newValue.ableValue.length > 0) {
        option.series.push({
          name: '可用功率',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.kygl,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.ableValue
        })
        option.legend.data.push('可用功率')
      }


      if (newValue.theoryValue.length > 0) {

        option.series.push({
          name: '理论功率',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.llgl,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.theoryValue
        })
        option.legend.data.push('理论功率')
      }

      if (newValue.referencePowerBySample != undefined && newValue.referencePowerBySample.length > 0) {

        option.series.push({
          name: '参照功率（样板机）',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.cfgf,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.referencePowerBySample
        })
        option.legend.data.push('参照功率（样板机）')
      }

      if (newValue.referencePowerByMeasuring != undefined && newValue.referencePowerByMeasuring.length > 0) {

        option.series.push({
          name: '参照功率（测风、测光）',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.cfgf,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.referencePowerByMeasuring
        })
        option.legend.data.push('参照功率（测风、测光）')
      }

      if (newValue.dq.length > 0) {
        option.series.push({
          name: '上报短期',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.dq,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.dq
        })
        option.legend.data.push('上报短期')
      }

      if (newValue.cdq.length > 0) {

        option.series.push({
          name: '上报超短期',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.cdq,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.cdq
        })
        option.legend.data.push('上报超短期')
      }

      if (newValue.globalR.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '总辐射',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.zfs,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.globalR
        })
        option.legend.data.push('总辐射')
      }
      if (newValue.diffuseR.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '散辐射',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.sfs,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.diffuseR
        })
        option.legend.data.push('散辐射')
      }
      if (newValue.obliqueR.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '斜辐射',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.xfs,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.obliqueR
        })
        option.legend.data.push('斜辐射')
      }
      if (newValue.directR.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '直辐射',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.zfs,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.directR
        })
        option.legend.data.push('直辐射')
      }
      if (newValue.wsInst10.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '10米风速',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.ws10,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.wsInst10
        })
        option.legend.data.push('10米风速')
      }
      if (newValue.wsInst30.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '30米风速',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.ws30,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.wsInst30
        })
        option.legend.data.push('30米风速')
      }
      if (newValue.wsInst50.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '50米风速',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.ws50,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.wsInst50
        })
        option.legend.data.push('50米风速')
      }
      if (newValue.wsInst60.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '60米风速',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.ws60,
              borderColor: 'rgba(64,94,94,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.wsInst60
        })
        option.legend.data.push('60米风速')
      }
      if (newValue.wsInst70.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '70米风速',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.ws70,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.wsInst70
        })
        option.legend.data.push('70米风速')
      }
      if (newValue.wsInst80.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '80米风速',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.ws80,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.wsInst80
        })
        option.legend.data.push('80米风速')
      }
      if (newValue.wsInst90.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '90米风速',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.ws90,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.wsInst90
        })
        option.legend.data.push('90米风速')
      }
      if (newValue.wsInst100.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '100米风速',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.ws100,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.wsInst100
        })
        option.legend.data.push('100米风速')
      }
      if (newValue.wsInst110.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '110米风速',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.ws110,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.wsInst110
        })
        option.legend.data.push('110米风速')
      }
      if (newValue.wsInst120.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: '120米风速',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.ws120,
              borderColor: 'rgba(201,209,210,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.wsInst120
        })
        option.legend.data.push('120米风速')
      }
      if (newValue.ws10.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: newValue.columns.ws10,
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwp10,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.ws10
        })
        option.legend.data.push(newValue.columns.ws10)
      }
      if (newValue.ws30.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: newValue.columns.ws30,
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwp30,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.ws30
        })
        option.legend.data.push(newValue.columns.ws30)
      }
      if (newValue.ws50.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: newValue.columns.ws50,
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwp50,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.ws50
        })
        option.legend.data.push(newValue.columns.ws50)
      }
      if (newValue.ws70.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: newValue.columns.ws70,
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwp70,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.ws70
        })
        option.legend.data.push(newValue.columns.ws70)
      }
      if (newValue.ws80.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: newValue.columns.ws80,
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwp80,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.ws80
        })
        option.legend.data.push(newValue.columns.ws80)
      }
      if (newValue.ws90.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: newValue.columns.ws90,
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwp90,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.ws90
        })
        option.legend.data.push(newValue.columns.ws90)
      }
      if (newValue.ws100.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: newValue.columns.ws100,
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwp100,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.ws100
        })
        option.legend.data.push(newValue.columns.ws100)
      }
      if (newValue.ws170.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: newValue.columns.ws170,
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwp170,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.ws170
        })
        option.legend.data.push(newValue.columns.ws170)
      }


      if (newValue.swr.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: 'nwp辐射',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwpfs,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.swr
        })
        option.legend.data.push('nwp辐射')
      }

      if (newValue.directRadiation.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: 'nwp直辐射',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwpzhfs,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.directRadiation
        })
        option.legend.data.push('nwp直辐射')
      }
      if (newValue.diffuseRadiation.length > 0) {
        option.series.push({
          yAxisIndex: 1,
          name: 'nwp散辐射',
          type: 'line',
          smooth: true,
          symbol: 'circle',
          symbolSize: 5,
          showSymbol: false,
          lineStyle: {
            normal: {
              width: 2
            }
          },
          // areaStyle: {
          //   normal: {
          //     color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
          //       offset: 0,
          //       color: 'rgba(50,194,219, 0.3)'
          //     }, {
          //       offset: 0.8,
          //       color: 'rgba(219, 50, 51, 0)'
          //     }], false),
          //       shadowColor: 'rgba(0, 0, 0, 0.1)',
          //       shadowBlur: 10
          //   }
          // },
          itemStyle: {
            normal: {

              color: cc.nwpsfs,
              borderColor: 'rgba(50,194,219,0.2)',
              borderwidth: 22
            }
          },
          data: newValue.diffuseRadiation
        })
        option.legend.data.push('nwp散辐射')
      }


      this.chart.setOption(option, true)
    },

  }
}
</script>
<style scoped>
#fpcharts {
  width: 100%;
  height: calc(80vh - 50px);
}
</style>
