Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Highcharts series update with animation

I can update the data value of a spider chart and see it animated using this method:

chart.series[i].setData(newSeries[i].data);

But, as the series in a spider chart consists not only of data but also other fields, as in

series: [{
            name: 'Allocated Budget',
            data: [43000, 19000, 60000, 35000, 17000, 10000],
            pointPlacement: 'on'
        }, {
            name: 'Actual Spending',
            data: [50000, 39000, 42000, 31000, 26000, 14000],
            pointPlacement: 'on'
        }]

Along with the data, when I need to change the value name: 'Actual Spending' , how can I update the series with animation?

Because, for example if I call:

chart.series[i].update({series: newSeries[i] , name : newName}); 

There won't be any animation.

If it is still unclear... Well, sometimes a jsfiddle is worth a 100 words.

like image 997
Orkun Ozen Avatar asked Apr 09 '15 22:04

Orkun Ozen


1 Answers

Update the name, then set the data with the desired animation:

chart.series[0].update({name:'new title'});
chart.series[0].setData(newData);

See working fiddle.

like image 149
falsarella Avatar answered Sep 20 '22 07:09

falsarella