Highcharts 在缩放或使用导航器后错误地可视化图表数据
Highcharts visualizes chart data incorrectly after zooming or using the navigator
我正在使用带有四个 yAxis 的 highstock。每个轴都包含一个包含 400 多个点的系列。最初图表是正确的,但只要稍作缩放或稍微移动导航器,整个图表就会发生变化。线条在不应该连接的地方连接,yAxis 似乎已损坏,数据点不再受尊重。
结果:图表显示完全错误的数据。
这在使用非序数 xAxis 时尤其烦人,尽管 bug 的出现并不是必需的。
预期视图(未缩放或更改导航):
使用导航器连接点后,y 轴发生了不必要的更改,预期的间隙不再可见:
三轴或所有系列都在一个轴上时不会出现此错误。好像还取决于图表的高度和宽度。
我有一个JSFiddle来演示。这段代码没有什么特别的。主要是:
$(function () {
$('#container').highcharts('StockChart', {
chart: {
zoomType: 'xy'
},
xAxis: {
ordinal: false
},
yAxis: [{
labels: {
format: '{value}°C'
},
title: {
text: 'Temperature1'
}
}, {
title: {
text: 'Temperature2'
},
labels: {
format: '{value}°C'
}
}, {
title: {
text: 'Temperature3'
},
labels: {
format: '{value}°C'
}
}, {
title: {
text: 'Temperature4'
},
labels: {
format: '{value}°C'
}
}],
series: [{
name: 'Temp1',
type: 'line',
yAxis: 0,
data: [{ "x": 1472569504959, "y": 37.0000003625635 }, ...
}, {
name: 'Temp2',
type: 'line',
yAxis: 1,
data: [{ "x": 1472569504959, "y": 37.0000003625635 }, ...
}, {
name: 'Temp4',
type: 'line',
yAxis: 3,
data: [{ "x": 1472569504959, "y": 37.0000003625635 }, ...
}, {
name: 'Temp3',
type: 'line',
yAxis: 2,
data: [{ "x": 1472569504959, "y": 37.0000003625635 }, ...
}]
});
});
这似乎是 dataGrouping
选项的功能。
禁用 dataGrouping
似乎工作正常。
代码:
plotOptions: {
series: {
dataGrouping: {
enabled: false
}
}
}
已更新fiddle:
参考:
我正在使用带有四个 yAxis 的 highstock。每个轴都包含一个包含 400 多个点的系列。最初图表是正确的,但只要稍作缩放或稍微移动导航器,整个图表就会发生变化。线条在不应该连接的地方连接,yAxis 似乎已损坏,数据点不再受尊重。
结果:图表显示完全错误的数据。
这在使用非序数 xAxis 时尤其烦人,尽管 bug 的出现并不是必需的。
预期视图(未缩放或更改导航):
使用导航器连接点后,y 轴发生了不必要的更改,预期的间隙不再可见:
三轴或所有系列都在一个轴上时不会出现此错误。好像还取决于图表的高度和宽度。
我有一个JSFiddle来演示。这段代码没有什么特别的。主要是:
$(function () {
$('#container').highcharts('StockChart', {
chart: {
zoomType: 'xy'
},
xAxis: {
ordinal: false
},
yAxis: [{
labels: {
format: '{value}°C'
},
title: {
text: 'Temperature1'
}
}, {
title: {
text: 'Temperature2'
},
labels: {
format: '{value}°C'
}
}, {
title: {
text: 'Temperature3'
},
labels: {
format: '{value}°C'
}
}, {
title: {
text: 'Temperature4'
},
labels: {
format: '{value}°C'
}
}],
series: [{
name: 'Temp1',
type: 'line',
yAxis: 0,
data: [{ "x": 1472569504959, "y": 37.0000003625635 }, ...
}, {
name: 'Temp2',
type: 'line',
yAxis: 1,
data: [{ "x": 1472569504959, "y": 37.0000003625635 }, ...
}, {
name: 'Temp4',
type: 'line',
yAxis: 3,
data: [{ "x": 1472569504959, "y": 37.0000003625635 }, ...
}, {
name: 'Temp3',
type: 'line',
yAxis: 2,
data: [{ "x": 1472569504959, "y": 37.0000003625635 }, ...
}]
});
});
这似乎是 dataGrouping
选项的功能。
禁用 dataGrouping
似乎工作正常。
代码:
plotOptions: {
series: {
dataGrouping: {
enabled: false
}
}
}
已更新fiddle:
参考: