Based on "Area range and line" demo, I created following example code :
Highcharts.setOptions({
global: {
useUTC: false
}
});
var opts = {
chart: {
renderTo: 'gfx',
zoomType: 'x'
},
title: {
text: 'Archived data'
},
xAxis: {
type: 'datetime'
},
tooltip: {
crosshairs: true,
shared: true
},
series:[
{"name":"cpuload (1 minute)", "type":"spline",
"data":[
[1364688000000,0.319545],
[1364742000000,0.195],
[1364752800000,0.144],
[1364756400000,0.266],
[1364767200000,0.245],
[1364770800000,0.184286],
[1364774400000,0.1],
[1364832000000,0.33],
[1364857200000,0.16],
[1364896800000,0.249091]
],
"zIndex":1,
},
{ name: "Range",
"type":"arearange",
"data":[
[1364688000000,0.02,0.55],
[1364742000000,0.1,0.29],
[1364752800000,0.08,0.22],
[1364756400000,0.19,0.33],
[1364767200000,0.11,0.38],
[1364770800000,0.08,0.41],
[1364774400000,0.1,0.1],
[1364832000000,0.33,0.33],
[1364857200000,0.09,0.23],
[1364896800000,0.31,0.31]
],
lineWidth: 0,
"linkedTo":":previous",
"zIndex":0,
"fillOpacity":0.3
}
]
}
chart = new Highcharts.Chart(opts);
But no graph is created. No error message, but no graphics :( If I change "type":"arearange", to "type":"spline", I got a graphic, with 2 line (as expected). And I stuck on that for 2 days without no luck :(
Any tip, idea code ?
Thanks
Laurent