So far none of our charts have dealt with dates, which is critical for time-series charts. In this recipe, we'll look at some of the different ways in which Highcharts can handle and display dates.
To set up a basic page and install jQuery and Highcharts, refer to the Getting ready section of the Creating your first chart recipe in Chapter 1, Getting Started with Highcharts.
To get started, perform the following steps:
Define the options as shown in the following code:
var options = { title: { text: 'Handling Dates', type: 'spline' } };
Set
xAxis.type
oryAxis.type
todatetime
for our chart, as shown in the following code:var options = { /* … */ xAxis: { type: 'datetime' } };
Create a new series for our chart with timestamp values for our data as shown in the following code:
var options = { /* … */ series: [{ name: 'Timestamps', data: [ [1356998400000, 3.141592], // 2013-01-01 ET [1363478400000, 2.314], //...