Search code examples
animationhighchartstreemap

HIGHCHARTS Treemap update is not working with animation


I am trying to get my highcharts treemap to update with new data, but with animation. The fiddle below gets as far as updating the chart, with animation, but only the data labels are showing up. Any help would be much appreciated.

Here is the update code:

$('#update').click(function(e) {
    var chart = treemap.highcharts(),
        data2 = [
            ["AA", 4],
            ["BA", 200],
            ["CA", 20]  
        ];
    chart.series[0].update({
      data: [data2]
    });
});

https://jsfiddle.net/92mrcpvx/


Solution

  • This issue is a bug in Highcharts versions above 7.0.3. It is reported here: https://github.com/highcharts/highcharts/issues/11738.

    1) The first workaround is to use version 7.0.3:

    2) The second workaround is to use setData() instead of update()

    $('#update').click(function() {
      chart.series[0].setData([
        ["A", 10],
        ["B", 2000],
        ["C", 150]
      ]);
    });