json date format to Highcharts date format
39,389
If your time is already UTC then it's as simple as:
Date.parse("01/01/2013 08:00")
EDITS
Assuming your data comes back as valid JSON:
var jsonObj = {value:"01/01/2013 08:00", key:5.5};
var seriesOneData = [];
seriesOneData.push([Date.parse(jsonObj.value),jsonObj.key]);
Author by
agri
Updated on July 09, 2022Comments
-
agri almost 2 years
Could please someone guide me how to get such json object datetime
{ value="01/01/2013 08:00", key=5.5 }
to javascript (to use in Highcharts) datetime acceptable format
[Date.UTC(2013, 0, 1,08,00), 5.5].
UPDATE
Here is what I'm trying to do:
var chart; $(document).ready(function () { chart = new Highcharts.Chart({ chart: { renderTo: 'container', zoomType: 'x' }, yAxis: { type: 'double', min: 0 }, xAxis: { type: 'datetime', labels: { formatter: function () { return Highcharts.dateFormat('%a %d %b %H:%M', this.value); }, dateTimeLabelFormats: { minute: '%H:%M', hour: '%H:%M', day: '%e. %b', week: '%e. %b', month: '%b \'%y', year: '%Y' } } }, series: [{ name: 'MyData1', data: [] }, { name: 'MyData2', data: [] }] }); chart.series[0].setData([ [Date.UTC(2013, 0, 1, 08, 00), 4.4], [Date.UTC(2013, 0, 1, 12, 00), 6.0], [Date.UTC(2013, 0, 1, 17, 00), 7.7], [Date.UTC(2013, 0, 1, 22, 00), 5.8] ]); chart.series[1].setData([ [Date.UTC(2013, 0, 1, 08, 30), 0.4], [Date.UTC(2013, 0, 1, 10, 00), 0.0], [Date.UTC(2013, 0, 1, 16, 00), 0.7], [Date.UTC(2013, 0, 1, 20, 00), 0.8] ]); });
here is it in jsFiddle.
var datatype1=[]; var datatype2= []; for(index in userReadingsJsonCollection.items){ if(userReadingsJsonCollection.items[index].ReadingsData.Reading_Type==type1){ datatype1.push( [Date.parse(userReadingsJsonCollection.items[index].ReadingsData.Rec_DateTime), userReadingsJsonCollection.items[index].ReadingsData.Reading] ); } if(userReadingsJsonCollection.items[index].ReadingsData.Reading_Type==type2){ datatype2.push( [userReadingsJsonCollection.items[index].ReadingsData.Rec_DateTime, userReadingsJsonCollection.items[index].ReadingsData.Reading] ); } }
The result I get is [[1357027200000,5.5]] and this works great.
-
agri over 11 yearsThanks Mark but this wouldn't work in this case, I've updated my question to specify.
-
Mark over 11 yearsI don't understand what you are after.
{value="01/01/2013 08:00", key=5.5}
is not valid JSON. Where is that coming from? If that was valid JSON, you want it converted to an array like[Date.UTC(2013, 0, 1,08,00), 4.4]
, but where does the 4.4 come from? Did you mean 5.5? -
agri over 11 yearsI have a json object that holds key, value pairs,in my case date and reading. Sorry for the confusion about the 4.4 and 5.5, take it as the same value. I'd like to load the chart dynamically from json but before I can do this I need to change the date format for Highcharts acceptable format.
-
Mark over 11 yearsSee edits. The other option is to change your value from a date string to a date epoch on the backend (whatever is generating the JSON) instead of in the Javascript as I do above.
-
JMHeap over 10 years@Mark Can you put the example of the second one from the fiddle with "day/month/year" resolution on X axis. The pointInterval will show days properly when using data without "dates", but if you specify [[Date.UTC(2012, 2, 7, 10), 5]] it shows time, not day on X axis. I have been trying to solve that but the documentation on that its not totally clear for people that starts to use highcharts.
-
Cerin almost 7 yearsThis answer doesn't make sense. If you have to heavily pre-process your data on the client side, that defeats the purpose of returning it via JSON.