Resetting Highcharts to initial state

highcharts, javascript, jquery

Solution

$('#resetChart').on("click", function(e){
    e.preventDefault();
    while(chart.series.length > 0) chart.series[0].remove(true);
    chart = new Highcharts.Chart(options);
});

http://jsfiddle.net/tapkr/1

Problem

Creating my Highchart with preset options works fine: ``` chart = new Highcharts.Chart(options); ``` However, when I want to destroy and recreate the chart it only destroys. Even if I remove `chart.destroy();` the chart is still just completely blanked but not recreated. ``` $('#resetChart').on("click", function(e){ e.preventDefault(); chart.destroy(); chart = new Highcharts.Chart(options); }); ``` A little stuck here on how to reset this chart. Edit:: Inspecting the chart container shows the Pie charts is creating something here but doesn't seem to be retrieving the data properly. Do I need to pass in my data variable again as well even though it's set in the options? ``` series: [{ name: name, data: data, /* changes bar size */ pointPadding: 0, borderWidth: 0, pointWidth: 15, shadow: false }] ``` Then data is defined on the page (For our CMS): ``` <script type="text/javascript"> data = [ { y: {value}, name: 'field1', id:'1' }, { y: {value}, name: 'field2', id:'2' }, { y: {value}, name: 'field3', id:'3' } ]; </script> ```

Original source