Page 1 of 1

Checkbox to show/hide all series

Posted: Thu Dec 06, 2018 10:25 pm
by sgtpepper
I would like to put a checkbox to the left of the text Hide/Show all series above the legends.

How do I put the checkbox and text there and how do I create the Hide/Show all functionin pure javascript code?

Re: Checkbox to show/hide all series

Posted: Fri Dec 07, 2018 10:56 am
by rafalS
Hi, sgtpepper!

You didn't give me much details so I am not sure if our Highcharts legends with checkboxes will be enough for you.
You can always create your own custom legend and use series.hide() and series.show() method.

Some useful API: https://api.highcharts.com/highcharts/p ... owCheckbox
https://api.highcharts.com/class-refere ... eries#hide
https://api.highcharts.com/class-refere ... eries#show

Let me know if you need any specific informations.

Best regards!

Re: Checkbox to show/hide all series

Posted: Tue Dec 18, 2018 10:08 pm
by sgtpepper
I found some inspiration here: https://jsfiddle.net/lot224/8qLdptLv

Ideally I would like the code to:

1) let the user switch between show all/hide using built standard Higcharts functionality
2) use setvisible() to control series visabilty
3) be written in pure javascript without jQuery
4) show an checkbox to the left of the label name to show but its necessary

Re: Checkbox to show/hide all series

Posted: Wed Dec 19, 2018 3:11 pm
by rafalS
sgtpepper,

Ok, I thought that you wanted HTML "checkbox" but you just meant "legend item".
Here is an example of what you've been trying to achieve without jQuery and with the ability to show/hide series: https://jsfiddle.net/BlackLabel/hcyz3pxj/

Let me know if you need anything else.

Best regards!

Re: Checkbox to show/hide all series

Posted: Fri Dec 21, 2018 6:46 pm
by sgtpepper
Actually I think that's exactly what I need!

Thank you so much and happy holidays!

Re: Checkbox to show/hide all series

Posted: Mon Dec 24, 2018 12:19 pm
by rafalS
You're welcome and thank you!