javascript - highcharts link series such that turn one off turns off the other - Stack Overflow

admin管理员组

文章数量:1245088

I would like to link a pair of series in highcharts so that clicking either one in the legend turns both in the pair on/off.

For example, in this fiddle, if I click 1A in the legend I would like it to also turn off 2A but leave 1B and 2B unaffected. Clicking 2A should also turn off 1A, i.e. the link should work both ways.

Is there a way to achieve this?

I would like to link a pair of series in highcharts so that clicking either one in the legend turns both in the pair on/off.

For example, in this fiddle, if I click 1A in the legend I would like it to also turn off 2A but leave 1B and 2B unaffected. Clicking 2A should also turn off 1A, i.e. the link should work both ways.

Is there a way to achieve this?

• javascript
• highcharts

Share Improve this question Follow asked Jul 9, 2013 at 9:41 harrygharryg 24.1k4747 gold badges134134 silver badges208208 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 12

You can also use linkedTo options from Highcharts, see: http://jsfiddle/GCqsf/4/

There is only one limit - linked series isn't displayed in legend, so probably it may not fit the best your example. Since Highcharts 3.0.7 you can set series.showInLegend = true to display linked series in legend.

You'll have to handle the legendItemClick event and specifically hide (and show) the "sister" series.

I have a running example in this jsFiddle.

Note that I'm using the links variable as an easy way to get the "sister" series for a given series.

Also note that I've added an id to each series so that chart.get() returns the series when given its id.

本文标签： javascripthighcharts link series such that turn one off turns off the otherStack Overflow