Search code examples
javascripthighchartsaxis-labels

Years-only display on xAxis with Highcharts


I have a graph which displays a line over many days, months and years. I'd like to have on the xAxis only every xth year displayed. In Safari, it displays it correctly; in Firefox (41.0), it displays 1970 all the way through. Here is a fiddle.

The data look like this:

    Date,Value
    1-Jan-1993,
    2-Jan-1993,
    3-Jan-1993,
    4-Jan-1993,
    5-Jan-1993,-4.30161566849

The xAxis definition like this:

    xAxis: 
    {
        tickWidth: 0,
        type: 'datetime',
        labels: 
        {
           format: '{value:%Y}'
        }
    }

Here is a screenshot of what Firefox spits out:

enter image description here

Thanks for any suggestions!


Solution

  • Firefox cannot parse your date strings in their current format they all return the default datetime of 1 Jan 1970, replacing all the - seperators with spaces allows Firefox, Chrome and IE to parse the dates correctly as seen here http://fiddle.jshell.net/z2uosh1a/