Echart常用功能

关于监听Echarts最多显示N个指标实现

// echarts初始化后，增加legnselectChanged事件监听：
this.chart.on(
        "legendselectchanged",
        this.ECThreeTrendSelectedCallback // 此为对事件的处理
      );
// param包含移除或新添的指标，操作后echarts的selected，事件名称
ECThreeTrendSelectedCallback(param) {
      let newSelected = [];
      let selected = param.selected;
      Object.keys(selected).forEach((key) => {
        if (selected[key]) {
          newSelected.push(key);
        }
      });
      let oldSelected = this.threeTrendChartSelect;
       
      if (newSelected.length < oldSelected.length) {
      // 此为移除，直接移除相关选项
        let removeIndex;

        oldSelected.forEach((item, index) => {
          if (newSelected.indexOf(item) === -1) {
            removeIndex = index;
          }
        });
        oldSelected.splice(removeIndex, 1);
      } else {
          // 此处实现，最多只能选中5个，超过5个，移除最先选中的，添加最后选中的
        let addItem;
        newSelected.forEach((item) => {
          if (oldSelected.indexOf(item) === -1) {
            addItem = item;
          }
        });

        oldSelected.push(addItem);
        if (newSelected.length > 5) {
          oldSelected.shift();
        }
      }
      // 更新原始数值的选中指标
      this.threeTrendChartCache.selectList = oldSelected;
      // 更新选择中标数组
      this.threeTrendChartSelect = oldSelected;
      // 重新渲染echarts
      this.setThreeTrendChart(this.threeTrendChartCache);
    }