HIghcharts xAxis labels out of order

Question

When zooming into data that I am formatting as quarterly, the xAxis labels are out of order (i.e. 4th quarter comes before 2nd quarter.) The tooltips are correct however. For both, I'm setting the format as "%Y Q%Q" and %Q is defined by:

Highcharts.dateFormats = {
    Q: function(timestamp) {
        var date = new Date(timestamp);
        switch(date.getMonth() + 1) {
            case 1: case 2: case 3: return 1;
            case 4: case 5: case 6: return 2;
            case 7: case 8: case 9: return 3;
            default: return 4;
        }
    }
}

Any ideas or suggestions where to start looking would be great. I've played around with different configuration options, but can't find anything that seems to affect it. Thanks!

See it in action at: http://research.stlouisfed.org/fred2/graph/graph-landing.php?id=GDPC1&cosd=2010-01-01&coed=2012-01-01

Edit: here is a JS Fiddle with a basic highcharts chart showing the same problem http://jsfiddle.net/MJCsw/1/

Answer 1

In general it is wrapper for highcharts (fredchart), but in default highcharts you can use formatter (ie. for tooltip or axis labels) and customise format. Additioanly you can set tickInterval which will be 31 * 24 * 3600 * 1000.

Answer 2

I was able to fix this by changing date.getMonth() to date.getUTCMonth() in my quarter calculation. It's strange the tooltip was correct without it though, there must be some timezone correction being done on the tooltips but not the axis labels.