echarts 点击legend只显示当前，隐藏其他

场景：

初始化渲染所有图例，echarts默认点击图例就隐藏该图例
要实现：

• 所有图例都是选中态，当点击一个图例时，取消其他图例，仅显示当前图例
• 点击该图例后，所有图例都是取消选中态时，选中全部图例

解决方法

• 监听图例点击事件, 判断当前点击是选中操作还是取消操作
• 判断是不是全部图例都选中时的取消操作
  • 选中当前图例，取消选中剩余图例
• 判断是不是取消之后就没有选中图例时的取消操作
  • 选中全部图例

const legendselect1 = legendData => {
//监听图例点击事件
 myChart.on('legendselectchanged', obj => {
 	//点击之后所有被选中的图例
    const selectedobj = Object.keys(obj.selected).filter(item => obj.selected[item])
    //点击的图例是否在 所有被选中的图例 中，也就是判断当前点击是选中操作还是取消操作
    const flag = (selectedobj.indexOf(obj.name) > -1)
    //当是取消操作 && 取消前所有图例都是选中状态
    //选中当前图例，取消选中剩余图例
    if (!flag && (selectedobj.length + 1 === legendData.length)) {
      for (let i = 0; i < legendData.length; i++) {
        // 显示当前legend 关闭非当前legend
        if (obj.name === legendData[i]) {
          myChart.dispatchAction({
            type: 'legendSelect',
            name: legendData[i],
          })
        } else {
          myChart.dispatchAction({
            type: 'legendUnSelect',
            name: legendData[i],
          })
        }
      }
    }
    //当是取消操作 && 取消后就没有图例是选中状态
    //选中所有图例
    if(!flag && !selectedobj.length ){
      for (var i = 0; i < legendData.length; i++) {
        myChart.dispatchAction({
            type: 'legendSelect',
            name: legendData[i]
        });
      }
    }
  })
}
legendselect1(['item1','item2','item3','item4'])
//参数[]=>图例data数据