0

i am using highchart and loading a json dynamically. json provides me the date time series and its value

The chart is being created and the tooltip is showing the correct value only the x-axis labels are not shown correctly.

  $(function () {
        $('#container').highcharts({
            xAxis: {
                type: 'datetime',
                dateTimeLabelFormats: {
                    day: '%e of %b'
                }
            },

            series: [{
                data: [
["2013-09-15 08:44:37",19.8],
["2013-09-18 08:47:37",18.4],
["2013-09-19 08:50:37",18.3],
["2013-09-20 08:53:37",18.1]
    ],
                //pointStart: Date.UTC(2010, 0, 1),
                pointInterval: 24 * 3600 * 1000 // one day
            }]
        });
    });

live plunkr : http://plnkr.co/edit/TfcJVPpqu6ZM2LywKmO5?p=preview

Kindly assist. Thanks

EDIT

I have updated the post and the plunkr with the correct dates

ankur
  • 557
  • 1
  • 10
  • 37

1 Answers1

3

Try putting the dates as getTime (milliseconds) format:

[new Date("2013-09-15T08:44:37").getTime(),19.8],
[new Date("2013-09-18T08:47:37").getTime(),18.4],
[new Date("2013-09-19T08:50:37").getTime(),18.3],
[new Date("2013-09-20T08:53:37").getTime(),18.1]

As in this plunker.

eladcon
  • 5,815
  • 1
  • 16
  • 19
  • any other way of doing that ..i mean if i dont want to use new Date().getTime() ? – ankur Feb 28 '15 at 22:36
  • highcharts expects milliseconds when using datetime, so you need to calculate it somehow. you can use any other method to get the milliseconds for example: the `Date.UTC` function – eladcon Feb 28 '15 at 22:53