echarts有l(wèi)egend控件可以控制多個折線圖之間的切換

legend: {
          data: ['財經(jīng)','娛樂','社會'],
          selectedMode: "single",     //單選模式，每次出現(xiàn)一條折線圖
          y: y,                                  //由于需要自適應(yīng)，此值用變量動態(tài)改變
          right: 10,
          inactiveColor: "#ADD9FF",         //選中狀態(tài)的顏色
          textStyle: {
            color: "#00FFFF"
          }
        },

其實(shí)legend里面有個選中屬性
默認(rèn)選中第一項“財經(jīng)”
如果選中娛樂這一項
legend可以設(shè)置為

legend: {
          data:  ['財經(jīng)','娛樂','社會'],
          selectedMode: "single",
          selected:{
              '財經(jīng)':false,
              '娛樂':true,
              '社會':false
          }
          y: y,
          right: 10,
          inactiveColor: "#ADD9FF",
          textStyle: {
            color: "#00FFFF"
          }
        },

如果要讓他自動切換折線，就要設(shè)置一個定時器動態(tài)的改變legend中的selected中的值

    /**
     * 動畫線型圖
     */
    moveLine: function(){
      this.timer = setTimeout(()=>{
        let option = this.line.getOption();
        let selected = {};
        for(let i=0;i<this.legendData.length;i++){    // this.legendData是legend中data的值，上面是寫死的值，做自動切換時不要寫死
          if(this.j==i){
            selected[this.legendData[i]] = true;
          }else{
            selected[this.legendData[i]] = false;
          }
        };
        this.line.clear();        // 清空原來的折線圖
        option.legend[0].selected = selected;    //更改legend里的selected
        this.line.setOption(option);            //重繪
        this.j += 1;
        if(this.j == this.legendData.length){
          this.j = 0;
        };
        this.moveLine();
      },5000)
    }