I'm using highcharts to create comparisons of various product features on my website. One of my primary charts has 45 series, one for each product in a particular category. On the front page of my site the chart loads with all series visible by default. However, when viewing the page of any particular product page (any of the 45 products that are visible on the chart), I would like for only that specific product's series to be visible be default, and the rest hidden.
Now, I know I can use "visible: false" to hide series, however this still seems like it would require me to have a separate highcharts chart for each of the 45 products, which seems like a waste of space / time since the only difference between those 45 charts would be the hidden/visible series. Does anyone have any idea how (and if it is possible at all) to make the visibility settings of a chart's series dependant on the page where the chart is loading?
So basically to demonstrate what I mean more clearly, suppose I have a chart with two series:
name: 'Product 1',
data: [X, Y, Z],
}, {
name: 'Product 2',
data: X, Y, Z],
Now, if we are on the product page of "Product 1", I would like for the chart to read:
name: 'Product 1',
data: [X, Y, Z],
}, {
name: 'Product 2',
data: X, Y, Z],
Visible: false
And if we are on the page of "Product 2", it should of course read:
name: 'Product 1',
data: [X, Y, Z],
Visible: false
}, {
name: 'Product 2',
data: X, Y, Z],
Only automatically of course, without me having to create a separate chart for each. I'm using Wordpress to manage my website, if that makes a difference.
Thanks!
