I’ve never had this happen before and I’m at a loss as to why this is happening. As you can see, even though point A’s datapoints is lower then B’s, it is appearing above it(first screen shot). What’s weird is that when I hide line B (2nd screen shot), line A correctly moves to the right position.


I put together a jsfiddle to demonstrate this issue:
http://jsfiddle.net/qwfZ9/1813/
And the code below:
var chart = new Highcharts.Chart({
chart:{
renderTo:"ChartArea",
defaultSeriesType:"line",
zoomType:"x",
plotBackgroundColor:"#c8c8c8",
backgroundColor:"#d5d5d5"
},
title:{
text:"TEST"
},
series:[{
name:"A",
data:[21,21,21,21,23,23,26,24,24,24,24,26,26,21,19,19,19,23,23,23,21,22,22,22,21,16],
pointStart:1314316800000,
pointInterval:86400000,
stack:0,
type:"line",
multiplier:1,
dashStyle:"solid",
color:"#AA4643"
},{
name:"B",
data:[51,51,51,51,52,53,50,47,47,47,47,46,46,42,41,41,41,67,65,66,50,53,52,53,64,59],
pointStart:1314316800000,
pointInterval:86400000,
stack:0,
type:"line",
multiplier:1,
dashStyle:"solid",
color:"#89A54E"}],
plotOptions:{
series:{
stacking:"normal",
borderColor:"black",
shadow:false,
borderWidth:0},
area:{
stacking:"normal",
shadow:false,
fillOpacity:0}},
LastUpdated:0,
colors:["#000000"],
yAxis:{
title:{
text:"Test Counts"
},
labels:{
rotation:0,
align:"right"
},
plotOptions:[{color:"#000000",
width:2,
value:0,
id:"plotline-1"}],
startOnTick:true,
showFirstLabel:true,
stackLabels:{
enabled:true,
style:{
color:"black"}},
min:0,
max:100},
xAxis:{
title:{
text:"Time"},
type:"datetime",
maxZoom:86400000,
tickInterval:86400000,
labels:{
rotation:-40,
align:"right",}},
credits:{
enabled:false},
ZoomTypeChanger:null,
yExtreme:null});
Removing
stacking:"normal"from yourseriesvalue forplotOptionsseems to fix the issue:You may want to file a bug report if the documentation does not suggest that there is some reason for the shift.