e-charts折线图Y轴显示与实际数据范围显示不符

问题描述：

使用e-charts折线图画出多条折线，且Y轴数据与legend提示数据相符合

---

原因分析：

由于设置`options`中的`series`时添加了`stack`堆叠，所以导致折线图显示的是多条线堆叠的效果，但是`legend`提示的又是实际数据，所以会造成Y轴显示与实际数据范围显示不符 效果图如下：

代码如下

this.myChart1 = this.$echarts.init(
        document.getElementById('oee-line-charts')
      )
      const option1 = {
        tooltip: {
          trigger: 'axis',
          backgroundColor: 'rgba(0,0,0,0.5)',
          textStyle: {
            color: '#FFFFFF', // 设置文字颜色
            fontWeight: 400,
            fontFamily: 'Source Han Sans CN',
            fontSize: '12px',
            lineHeight: '18px'
          },
          formatter: function(params) {
            let str = `示例<br/>`
            params.forEach(item => {
              str += item.value !== null ? `${item.value}%<br/>` : `--<br/>`
            })
            return str
          }
        },
        color: ['#44D6A4', '#0E87FF', '#F8A81E', '#596ea4'],
        legend: {
          data: ['折线一', '折线二', '折线三', '折线四']
        },
        grid: {
          top: '10%',
          x: 55,
          y: 45,
          x2: 30,
          y2: 40,
          borderWidth: 1
        },
        xAxis: [
          {
            type: 'category',
            data: this.xAxisData || [],
            boundaryGap: false,
            axisLine: {
              show: true,
              lineStyle: {
                color: '#A9AAAB'
              }
            },
            splitLine: {
              show: true,
              lineStyle: {
                color: ['rgb(200,212,232)'],
                width: 1,
                type: 'dashed'
              }
            },
            axisPointer: {
              snap: true,
              lineStyle: {
                color: '#44D6A4',
                width: 2
              }
            }
          }
        ],
        yAxis: [
          {
            type: 'value',
            name: '单位：%',
            axisLabel: {
              formatter: function(value, index) {
                return `${value}%`
              }
            },
            axisLine: {
              show: true,
              lineStyle: {
                color: '#A9AAAB'
              }
            },
            splitLine: {
              show: true,
              lineStyle: {
                color: ['rgb(200,212,232)'],
                width: 1,
                type: 'dashed'
              }
            }
          }
        ],
        series: [
          {
            name: '折线一',
            type: 'line',
            stack: '总量',
            data: this.oeeList || [],
            symbolSize: 10,
            symbol: 'emptyCircle',
            smooth: true,
            lineStyle: {
              width: 2,
              color: '#44D6A4'
            },
            itemStyle: {
              normal: {
                borderColor: '#44D6A4'
              }
            }
          },
          {
            name: '折线二',
            type: 'line',
            stack: '总量',
            data: this.timeEfficiencyList || [],
            symbolSize: 10,
            symbol: 'emptyCircle',
            smooth: true,
            lineStyle: {
              width: 2,
              color: '#0E87FF'
            },
            itemStyle: {
              normal: {
                borderColor: '#0E87FF'
              }
            }
          },
          {
            name: '折线三',
            type: 'line',
            stack: '总量',
            data: this.performanceList || [],
            symbolSize: 10,
            symbol: 'emptyCircle',
            smooth: true,
            lineStyle: {
              width: 2,
              color: '#F8A81E'
            },
            itemStyle: {
              normal: {
                borderColor: '#F8A81E'
              }
            }
          },
          {
            name: '折线四',
            type: 'line',
            stack: '总量',
            data: this.yieldList || [],
            symbolSize: 10,
            symbol: 'emptyCircle',
            smooth: true,
            lineStyle: {
              width: 2,
              color: '#596ea4'
            },
            itemStyle: {
              normal: {
                borderColor: '#596ea4'
              }
            }
          }
        ]
      }
      // 使用刚指定的配置项和数据显示图表。
      this.myChart1.setOption(option1)
      const self = this
      window.addEventListener('resize', function() {
        self.myChart1.resize()
      })

---

解决方案：

删除`options`配置项中`series`里面每一项的堆叠效果`stack`

删除之后的效果如下：