Highcharts redraw not working with alignTicks

Question

I have updated from version 2.1.6 to 4.0.4 and I have problem with refreshing the alignTicks option. I start with the property at true and then I set it to false via a button. From true to false the graph is only updated after a windows resize or if I disable/enable one set of data. From false back to true then it work correctly...

Here an example:

chart = new Highcharts.Chart({
  'chart': {
    'renderTo': 'graph',
    'type': 'line',
    'zoomType': 'x',
    'alignTicks': true
  },
  'tooltip': {
    'formatter': function () {
      var d = new Date(this.x);
      return 'Time: <b>' + ('0' + d.getUTCHours()).slice( - 2) + ':' + ('0' + d.getUTCMinutes()).slice( - 2) + ':' + ('0' + d.getUTCSeconds()).slice( - 2) + '</b><br/> Value: <b>' + this.y + '</b>';
    }
  },
  'credits': false,
  'title': {
    'text': 'Date: 04-11-2014 - Location: Locale'
  },
  'xAxis': {
    'type': 'datetime'
  },
  'yAxis': [
    {
      'title': {
        'text': 'SK_angle',
        'style': {
          'color': '#4572A7'
        }
      },
      'labels': {
        'style': {
          'color': '#4572A7'
        }
      },
      'opposite': false,
      'allowDecimals': true
    },
    {
      'title': {
        'text': 'EL_angle',
        'style': {
          'color': '#AA4643'
        }
      },
      'labels': {
        'style': {
          'color': '#AA4643'
        }
      },
      'opposite': true,
      'allowDecimals': true
    },
    {
      'title': {
        'text': 'Software Status',
        'style': {
          'color': '#89A54E'
        }
      },
      'labels': {
        'style': {
          'color': '#89A54E'
        }
      },
      'opposite': false,
      'allowDecimals': false
    }
  ],
  'series': [
    {
      'color': '#4572A7',
      'name': 'SK_angle',
      'yAxis': 0,
      'data': [
        [1415064918000,305.89],
        [1415064919000,335.0],
        [1415064923000,306.05],
       ]
    },
    {
      'color': '#AA4643',
      'name': 'EL_angle',
      'yAxis': 1,
      'data': [
        [1415064918000,37.87],
        [1415064919000,37.2],
        [1415064923000,37.9],
      ]
    },
    {
      'color': '#89A54E',
      'name': 'Software Status',
      'yAxis': 2,
      'data': [
        [1415064918000,1362],
        [1415064919000,1362],
        [1415064923000,1256],
      ]
    }
  ]
});

$('#scaleAlign').click(function() {
    if (chart.options.chart.alignTicks) {
        chart.options.chart.alignTicks = false;
        $('#scaleAlign').attr('value','Align Scale'); 
    }
    else {
        chart.options.chart.alignTicks = true;
        $('#scaleAlign').attr('value','Unalign Scale');
    }
    chart.isDirtyBox = true;
    chart.redraw();
});

http://jsfiddle.net/04Lffe0r/3/

Answer 1

Update the code like this: http://jsfiddle.net/04Lffe0r/4/

By adding this:

chart.series[0].isDirty = true;

Because the series should be set as dirty for the chart to redraw.