javascript - highcharts 图例的反向功能

Question

我想知道是否有任何方法可以更改图表中显示的图例的功能。

http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/highcharts/demo/column-stacked/

<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>

对于此示例，是否有可能当您单击“John”时，该选项已被选中，而所有其他选项均未被选中。

现在，如果您单击“John”，它会取消选择该选项。所以我现在基本上想撤销它的默认功能。

还有可能在图例末尾添加“显示全部”选项吗？

Answer 1

要在图例末尾创建“显示全部”选项，您可以添加一个具有该名称的空系列，如下所示:

series: [{
    // ...
}, { 
    name: 'Show All' 
}]

然后要反转图例功能，您可以使用 legendItemClick 事件，同时检查对虚拟系列的点击，例如:

plotOptions: {
    series: {
        events: {
            legendItemClick: function(event) {
                var s = this.chart.series;
                for(i = 0; i < s.length; i++) {
                    if(this.name == 'Show All' || this == s[i])
                        s[i].setVisible(true);
                    else
                        s[i].setVisible(false);
                }
                return false;
            }
        }
    }
}

参见 this JSFiddle demonstration使用您的初始演示。