Highcharts – redesenhar () vs. novo Highcharts.chart

Eu estou lutando para entender a maneira correta de atualizar um gráfico de charts. Supondo que eu tenha apresentado um gráfico e, em seguida, quero atualizá-lo de alguma forma. Por exemplo, posso querer alterar os valores da série de dados ou talvez queira ativar os dataLabels.

No momento, a única maneira de descobrir como fazer isso é alterar as opções do gráfico e usar o new Highcharts.chart para que os highcharts sejam redesenhados.

No entanto, eu estou querendo saber se isso pode ser um exagero e pode ser possível alterar o gráfico “in situ”, sem ter que começar do zero com o new Highcharts.chart . Percebo que existe um método redraw() , mas parece que não consigo funcionar.

Qualquer ajuda é muito apreciada.

Obrigado,

Robin

Exemplo de código é o seguinte e na parte inferior há um 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/

[editar]:

Para qualquer espectador futuro desta questão, é importante notar que não existe um método para ocultar e mostrar dataLabels. O seguinte mostra como fazê-lo: http://jsfiddle.net/supertrue/tCF8Y/

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

O método setData si irá chamar o método de redesenho

você tem que chamar set e adicionar funções no object gráfico antes de chamar redesenhar.

 chart.xAxis[0].setCategories([2,4,5,6,7], false); chart.addSeries({ name: "acx", data: [4,5,6,7,8] }, false); chart.redraw(); 
 var newData = [1,2,3,4,5,6,7]; var chart = $('#chartjs').highcharts(); chart.series[0].setData(newData, true); 

Explicação:
Variável newData contém valor que deseja atualizar no gráfico. chart variável é um object de um gráfico. setData é um método fornecido pelo highchart para atualizar dados.

O método setData contém dois parâmetros, no primeiro parâmetro precisamos passar um novo valor como array e o segundo param é um valor booleano. Se true , o gráfico atualiza a si mesmo e, se false , é necessário usar o método redraw() para atualizar o gráfico (ou seja, chart.redraw(); )

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

@RobinL como mencionado nos comentários anteriores, você pode usar chart.series [n] .setData (). Primeiro, você precisa ter certeza de que atribuiu uma instância de gráfico à variável de gráfico, assim adota todas as propriedades e methods necessários para acessar e manipular o gráfico.

Eu também usei o segundo parâmetro de setData () e falhei, para evitar a renderização automática do gráfico. Isso aconteceu porque eu tenho várias séries de dados, então prefiro atualizar cada uma delas, com render = false e, em seguida, executando chart.redraw (). Esse desempenho multiplicado (estou tendo de 10.000 a 100.000 pontos de dados e atualizando o dataset a cada 50 milissegundos).