echarts折线图监听showtip后图例事件失效

  一、问题
  1、chart监听showtip后，点击图例无法更改series状态。
  2、一监听到showtip，图例的修改就会无效，series会恢复到上一次的状态。
  3、点击全选或反选后，会出现上一个问题（2、）。

  二、问题原因
  1、需要监听legendselectchanged事件并setOption()。
  2、图例处也有tooltip的显示，也会监听的showtip，也就是图例事件触发后一移动就会触发showtip事件重新setOption()，最好是在图例处不执行监听showtip里面的操作。
  3、原理同1、，需要监听legendselectall、legendinverdeselect设置setOption()。

  三、解决方法

		var that = this;

        //监听showtip给每条线设置markpoint
        this.myChart.on('showTip',function (params) {
                var isLegend = params.from;
                //图例部分也有tooltip的显示，也会被监听，需要判断不为图例时再进行以下操作以防止图例事件无效
                if(typeof(isLegend)=="undefined")
                {
                    var series = that.echartsOption.series;
                    let xindex=params.dataIndex;
                    for(let i=0;i<series.length;i++)
                    {
                        that.echartsOption.series[i].markPoint.data.splice(0,that.echartsOption.series[i].markPoint.data.length);//清空数组
                        let temp = that.echartsOption.series[i].data[xindex];
                        that.echartsOption.series[i].markPoint.data.push({ xAxis: xindex, yAxis: temp, name: 'num',value: temp});
                    }
                
                    //重新渲染
                    that.myChart.setOption(that.echartsOption);
                }
        });

        //showtip监听多次设置setoption后，图例事件失效
        this.myChart.on('legendselectchanged', function(params) {

            var qx_name = params.name;
			var select_key = Object.keys(params.selected);
			var select_value = Object.values(params.selected);
            //修改选中状态 需要在lengend里加上selected属性
			for(var i=0; i < select_key.length; i++){
				if(select_key[i] == qx_name){
					that.echartsOption.legend.selected[select_key[i]] = !that.echartsOption.legend.selected[select_key[i]];
				}
                // else{
				// 	option.legend.selected[select_key[i]] = true;
				// }
				
			}
            //需要重新设置option，不然一监听到showtip就会加载原来的option。如果第二个参数为true的话，表示不合并会删除原来组件，根据新的option创建，
            //没有或false表示合并
            that.myChart.setOption(that.echartsOption);

        });
 
        //点击全选或反选后，一监听到showtip，就会加载到原来的option，全选反选无效，需监听事件设置option
        //全选事件在selector设置为all时才会触发
        this.myChart.on('legendselectall', function(params) {
			var select_key = Object.keys(params.selected);
			var select_value = Object.values(params.selected);
            //修改选中状态
			for(var i=0; i < select_key.length; i++){
				that.echartsOption.legend.selected[select_key[i]] = true;
			}

            that.myChart.setOption(that.echartsOption);
        });

        this.myChart.on('legendinverseselect', function(params) {
			var select_key = Object.keys(params.selected);
			var select_value = Object.values(params.selected);
            //修改选中状态
			for(var i=0; i < select_key.length; i++){
				that.echartsOption.legend.selected[select_key[i]] = !that.echartsOption.legend.selected[select_key[i]];
			}

            that.myChart.setOption(that.echartsOption);
        });