echarts图表设置关于图例legend，限制图例可点击时最少保留显示一个图例，防止图表光秃秃

以echarts的柱状图作为示例，图例可以设置点击，控制对应的柱子显示隐藏，那么问题来了，如果所有的柱子都可以点击隐藏，那么就会剩下一个光秃秃的x轴，页面展示则会特别丑！如下

光秃秃的echarts图

如果想要更美观，这种情况下可以设置至少保留一个图例。即只剩下一个图例时，点击不隐藏该柱子。

上代码

ecElement = echarts.init(document.getElementById(' ecElement '));

var option = {...};//echarts图的一些配置项

ecElement.clear();

ecElement.setOption(option);

//下面是重点

ecElement.on('legendselectchanged', function (params) { 

    var optionLegend = ecElement.getOption(); 

    var select_value = Object.values(params.selected); 

    var n = 0; 

    select_value.map(function (res) {

         if (!res) { 

             n++; 

          } 

    });

     if (n == select_value.length) {

         optionLegend.legend[0].selected[params.name] = true;

    }

     ecElement.setOption(optionLegend)；

});      

这样子就可以达成目的了，无论你如何点击都至少会保留一个图例和对应的柱子的

完成！

希望可以帮助到遇到同样问题的你！