I am using HighCharts for a line graph report. In this specific report I have been asked to Customize the colours of each series. The series will always stay the same. So fo
Options can be set separately for each series.
var chart = new Highcharts.Chart({
chart: {
renderTo: 'container'
},
xAxis: {
type: 'datetime'
},
series: [{
name: 'John',
color: '#0066FF',
dashStyle: 'ShortDash',
data: [
[Date.UTC(2010, 0, 1), 29.9],
[Date.UTC(2010, 2, 1), 71.5],
[Date.UTC(2010, 3, 1), 106.4]
]
},{
name: 'Mary',
color: '#FF0000',
data: [
[Date.UTC(2010, 0, 1), 60.9],
[Date.UTC(2010, 1, 1), 40.5],
[Date.UTC(2010, 2, 1), 90.0],
[Date.UTC(2010, 3, 1), 80.4]
]
}]
});
JsFiddle Example
If you read the api here, you'll see the following text.
Serie
The actual series to append to the chart. In addition to the members listed below, any member of the
plotOptions
for that specific type of plot can be added to a series individually. For example, even though a generallineWidth
is specified inplotOptions.series
, an individuallineWidth
can be specified for each series.
So you can add anything from plotOptions
.
Demo:
series: [{
name: 'serie1',
data: [0,1,2,3,4,5,6,7,8,9],
color: '#FFFF00',
lineWidth: 4,
id: 'serie1',
step: true
}]
Working demo