Animation axislabel shift

author(s): Koos Zoon

HTML

<script src="http://code.highcharts.com/highcharts.js"></script>
<div id="container" style="height: 300px; width: 500px" ></div>
<button id="update">Update chart</button>

JavaScript

$(function () {
    var chart = new Highcharts.Chart({
    
        chart: {
            renderTo: 'container',
            type:'line'
        },
    
        xAxis: {
           categories: ['A', 'B','C'],
            tickmarkPlacement:'on',
            gridLineWidth:1
        },
    
        series: [{
            data: [1500, 250,85]
        }]
    
    });
    
    i = 1;
    $('#update').click(function() {
        var low = i++ % 3;
        chart.series[0].data[0].update(low ? 2 : 1700);
        chart.series[0].data[1].update(low ? 3 : 250);
       chart.series[0].data[2].update(low ? 5 : 85);
      });
});