The series is a set of data. You may have single or multiple data series. The series object can be of the following format:
series:[{
data: [23, 34, 12, 54, 32, ... , 43]
}]
where all the values in the data array indicates y axes values Example
Data in this format is considered a category chart by default and the categories has to be provided in xaxis.categories
property like this
xaxis:{
categories: ["Jan", "Feb", "Mar", ... , "Dec"]
}
The “single values” format is easier for category chart like column-chart/bar-chart where you need to show comparisons between categories of data
2.1) Numeric Paired Values in two-dimensional array
series: [{
data: [[1, 34], [3, 54], [5, 23] , ... , [15, 43]]
}],
xaxis: {
type: 'numeric'
}
where the 1st index is the x axes value and the 2nd index is the y axes value. Make sure to set the xaxis type to
numeric
as shown above.
Example
2.2) Numeric paired values in XY properties
Another way to create a numeric paired series is to pass the XY values as an object as shown below. Here also, don’t forget to set the xaxis.type: 'numeric'
as the X values contain numbers.
series: [{
data: [{
x: 20,
y: 54
}, {
x: 30,
y: 66
}],
}],
xaxis: {
type: 'numeric'
}
2.3) Category paired values
Instead of providing a separate xaxis.categories
array, you can also provide a category (x value) along with the y value. Notice, the x
property can accept a string value unlike number in previous example.
series: [{
data: [{
x: 'Apple',
y: 54
}, {
x: 'Orange',
y: 66
}],
}],
xaxis: {
type: 'category'
}
Certain chart-types like Treemap only accepts this format. This format is also helpful in adding additional information along with the data-point that may be used in other places (for eg., in tooltip, datalabels, etc). This is the recommended format for axis charts for ease of use.
To plot a timeline series you need to either provide timestamp values in the following manner
3.1) Timestamps
series: [{
data: [[1324508400000, 34], [1324594800000, 54] , ... , [1326236400000, 43]]
}]
Example
or you can provide date strings in the following way
3.2) Date strings
series: [{
data: [{ x: '05/06/2014', y: 54 }, { x: '05/08/2014', y: 17 } , ... , { x: '05/28/2014', y: 26 }]
}]
The DateTime String which you provide should return
true
when parsed through JavaScript’s Date.parse() function
Example
series: [23, 11, 54, 72, 12],
labels: ["Apple", "Mango", "Banana", "Papaya", "Orange"]