echarts 5.x 如果legend设置selected时,legend需要单击两次才能切换状态

发布时间 2023-05-02 11:04:59作者: 赵辉Coder

在第一组的selected里面先进行声明,在当前组再进行一次声明就可以了。

  legend: [
        {
          show: true,
          x: 'center',
          y: '0',
          data: ['日平均气温(℃)', '日平均室温(℃)'],
          textStyle: {
            fontSize: 14,
          },
          seriesIndex: 0,
          icon: 'roundRect',
          itemHeight: 2,
          itemWidth: 15,
          selected: {
            [this.linkLegendSelectd]: false,
          },
        },
        {
          show: true,
          // x: 'center',
          y: '55%',
          data: [],
          textStyle: {
            fontSize: 14,
          },
          itemHeight: 15,
          itemWidth: 15,
          seriesIndex: 1,
          selected: {
            [this.linkLegendSelectd]: false,
          },
        },
        {
          show: true,
          right: '27%',
          y: '55%',
          data: [],
          icon: 'roundRect',
          itemHeight: 2,
          itemWidth: 15,
          textStyle: {
            fontSize: 14,
          },
          seriesIndex: 1,
          selected: {
            [this.linkLegendSelectd]: false,
          }, //因为这里需要默认不选中,所有我将每个legend选项都配置为这个
        },
      ],

修改状态的时候也要记得修改:

    this.linkLegendSelectd = '供热量(GJ)';
              this.linkChartOption['legend'][0]['selected'] = {
                [this.linkLegendSelectd]: false,
              };
              this.linkChartOption['legend'][1]['selected'] = {
                [this.linkLegendSelectd]: false,
              };
              this.linkChartOption['legend'][2]['selected'] = {
                [this.linkLegendSelectd]: false,
              };