How to disable a highchart chart completely

Question

I am trying to figure out how to disable a chart (pie chart, column chart, etc.) completely but I haven't been able to do it at all. Once I set the whole section within the chart to hidden, part of the chart continues there.

HTML

<div id="pieChartSection"class="row">
      <div class="col-md-6" id="myPieChart" style="min-width: 500px; height: 350px; max-width: 600px; margin: 0 auto"></div>
</div>

Then, at some point on my JS I do...

document.getElementById(id).style.visibility = "hidden";

where the id is "pieChartSection"

Thanks.

Answer 1

** updated answer **

so just as an example, I added a button to your jsfiddle demo.

using jQuery, you can add a toggle event like this:

$('button').click(function(){ $('#pieChartSection').toggle(function(){

and then embed the rest of your code within that toggle fuction, as seen in the jsfiddle demo.

I hope this helps!

Cheers