Keenan Keenan - 3 months ago 9
jQuery Question

Having trouble with x-axis using type: datetime

Here's my code:

$(document).ready(function() {

var options = {
chart: {
renderTo: 'container',
type: 'spline'
},
series: [{}],
title: {
text: 'Humidity vs Time',
x: -20 //center
},
xAxis: {
type: 'datetime'
title: {
text: 'Time'
}
},
yAxis: {
title: {
text: 'Humidity'
},
plotLines: [{
value: 0,
width: 1,
color: '#808080'
}]
}
};

$.getJSON('humidity', function(data) {
options.series[0].data = data;
var chart = new Highcharts.Chart(options);
});

});


The json data it's grabbing is this, with the first variable being the milliseconds since 1970:

[[1331028000000, 5], [1331031600000, 6], [1331035200000, 4]]


Im currently trying to graph datapoints, with one being a time, and the other a value. To do this, I've been trying to use the datetime x-axis to format the time variables from milliseconds since 1970 to some thing nice, but the first step is to get it actually running with just time in milliseconds on the x-axis. The problem is that when I try to graph this with the x-axis's type declared as datetime, the graph fails to load. However, if I comment out "type: 'datetime'", the graph loads fine, albeit with massive x-axis values that I can't format.

Is there something obvious I'm missing here?

Answer

You're missing a comma after type: 'datetime'. Add a comma and it should work fine.