reverse functionality of highcharts legend

Question

I was wondering if there was any way to change the functionality of the legend shown in the chart.

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>

For this example, is it possible that when you click "John", that is the option that is picked and all of the other options are not selected.

right now if you click "John", it deselects that option. So I basically want to reverse the default functionality of it now.

Also would it be possible to add a "Show All" option at the end of the legend?

Answer 1

To make a "Show All" option at the end of the legend you could add an empty series with that name, like this:

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

And then to reverse the legend functionality you can use the legendItemClick event, along with checking for clicks on your dummy series, for example like this:

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;
            }
        }
    }
}

See this JSFiddle demonstration using your initial demo.