Joel
Joel

Reputation: 17

Highcharts date not showing correctly on x-axis

I'm new to highcharts, and it has been trivial working with the arearange one. I'm trying to setup the data to be graphed, which "technically" works. It reads in epoch time, so I have that all setup. All the dates are correct. However, when it is graphed, for whatever reason it seems to just only be saying "01/17" on the x-axis for month/date. The dates are across multiple months, and you can see it in the fiddle I've provided below.

http://jsfiddle.net/4azb64t7/

var data = [
    [1419465600, 5, 20],
    [1420848000, 20, 30],
    [1422144000, 30, 40],
    [1423526400, 45, 50],
    [1424390400, 35, 40],
    [1425168000, 30, 35]
];

(function ($) {
    $(function () {
        $('#container').highcharts({

            chart: {
                type: 'arearange',
                zoomType: 'x'
            },

            title: {
                text: 'Amount of daily players'
            },

            xAxis: {
                type: 'datetime',
                labels: {
                    formatter: function () {
                        return Highcharts.dateFormat('%m/%d', this.value);
                    }
                },
                tickPixelInterval: 200
            },

            yAxis: {
                title: {
                    text: null
                }
            },

            tooltip: {
                crosshairs: true,
                shared: true,
                valueSuffix: 'players'
            },

            legend: {
                enabled: false
            },

            series: [{
                name: 'Players',
                data: data
            }]
        });
    });
})(jQuery);

In the var data, it goes by epoch time, and then the low/high numbers for the area range chart. From top to bottom it is sorted by date. But if you look at the output, they all say 01/17, why is this?

Upvotes: 0

Views: 1743

Answers (1)

dfgd
dfgd

Reputation: 455

Timestmaps for highcharts must be in milliseconds. http://jsfiddle.net/4azb64t7/2/

var data = [
    [142084800000, 20, 30],
    [142214400000, 30, 40],
    [142352640000, 45, 50],
    [142439040000, 35, 40],
    [142516800000, 30, 35]
];

Upvotes: 2

Related Questions