Question

I have a chart that has a custom legend i.e. it isn’t part of Highcharts at all, it’s completely my own code, the Highcharts legend is disabled for this chart.

Is it possible to turn series data AND plot bands on/off in a Highcharts chart using the API?

I found an example that triggered the click event of a legend item to do this, but this obviously relies on a legend being present, so this is no use to me: http://birdchan.com/home/2013/01/23/trigger-a-click-event-on-a-legend-item-in-highchart/

I also tried to set the series data .visible property to false and then redraw the chart and although it sets the visible property just fine, it doesn’t redraw the chart so nothing changes:

var chart = new Highcharts.Chart(myoptions);

$("#custom_legend_link").click(function (e) {
    chart.series[0].visible = !chart.series[0].visible;
    chart.redraw();
}

Here is a jsFiddle using the basic line demo showing my problem:

http://jsfiddle.net/gfyans/zsaV4/

Thanks,
Greg.

Answer 1

To toggle the series, use Series.setVisible(). When called without parameters, it toggles.

Plot bands are a bit different, since they don’t have methods like hide(), show() or setVisible. To toggle a plot band, you need to remove it by Axis.removePlotBand() and add a new one with the same options by Axis.addPlotBand().