Highcharts - redraw () vs new Highcharts.chart

Question

I am struggling to figure out the right way to update the tall chart diagram. Suppose I display a chart, and then I want to update it somehow. For example, I can change the values ​​of a data series, or I may want to include dataLabels.

new Highcharts.chart now, the only way to figure out how to do this is to change the chart options and use new Highcharts.chart to show the redrawing of the high charts.

However, I am wondering if this might be redundant, and it may be possible to change the diagram in place without having to start from scratch using new Highcharts.chart . I notice that there is a redraw() method, but I cannot get it to work.

Any help is greatly appreciated.

Thank,

Robin

The sample code is as follows, and below is jsFiddle

 $(document).ready(function() { chartOptions = { chart: { renderTo: 'container', type: 'area', }, series: [{ data: [1,2,3] }] }; chart1 = new Highcharts.Chart(chartOptions); chartOptions.series[0].data= [10,5,2]; chart1 = new Highcharts.Chart(chartOptions); //The following seems to have no effect chart1.series[0].data = [2,4,4]; chart1.redraw(); });​ 

http://jsfiddle.net/sUXsu/18/

[edit]:

For any future viewers of this question, it is worth noting that there is no way to hide and show dataLabels. The following shows how to do this: http://jsfiddle.net/supertrue/tCF8Y/

Answer 1

chart.series[0].setData(data,true);

The setData method itself will call the redraw method

Answer 2

You need to call the install and add functions on the chart object before calling the redraw.

 chart.xAxis[0].setCategories([2,4,5,6,7], false); chart.addSeries({ name: "acx", data: [4,5,6,7,8] }, false); chart.redraw(); 

Answer 3

 var newData = [1,2,3,4,5,6,7]; var chart = $('#chartjs').highcharts(); chart.series[0].setData(newData, true); 

Explanation:
The variable newData contains the value that you want to update in the chart. The variable chart is a chart object. setData is a high-speed method for updating data.

The setData method contains two parameters, in the first parameter we need to pass the new value as an array, and the second parameter is a logical value. If true then updates the charts, and if false , we must use the redraw() method to update the chart (i.e. chart.redraw(); )

http://jsfiddle.net/NxEnH/8/