我相信我在 Highcharts 中发现了一个错误——我看不出它怎么可能是我的代码(但这不是我第一次错了!(jsfiddle 链接如下)。这可能是一个严重的问题问题,因为在某些情况下,错误的位置可能会“超出图表”,这可能会在医疗保健领域产生严重影响!
显示它的最简单情况:日期时间 x 轴上的 2 点样条和单个垂直条。如果添加了第二个垂直条,但数据为空,则原始条的位置偏移不正确。(为简单起见,在我的示例中,我对竖线和样条曲线的终点使用相同的日期时间,但这不是查看问题所必需的。)我已经在不同版本的 Highcharts 中重现了这一点,包括最新的3.0.0。
在我的 jsfiddle 示例中,我注释掉了第二个竖线,并且显示正确;只需取消注释该部分即可查看不正确的偏移量。如果第二个垂直条的数据不为空,则第一个垂直条再次正确显示。
http://jsfiddle.net/ckapilla/8vdkf/
// 3/20/2003
var startDt = Date.UTC(2013, 3 - 1, 20, 0, 0, 0);
var stopDt = Date.UTC(2013, 3 - 1, 20, 11, 59, 59);
var date1 = Date.UTC(2013, 3 - 1, 20, 8, 0, 0);
var date2 = Date.UTC(2013, 3 - 1, 20, 11, 0, 0);
var yMaxBG = 400;
var yMaxIns = 30;
var emptyData = [];
var barData = [{
x: date2,
y: 24
}];
var splineData = [{
x: date1,
y: 49
}, {
x: date2,
y: 141
}];
var glycemicChart = new Highcharts.Chart({
chart: {
renderTo: 'container'
},
xAxis: {
type: 'datetime',
min: startDt,
max: stopDt,
dateTimeLabelFormats: {
day: '%e-%b-%Y'
},
tickInterval: 24 * 3600 * 1000,
gridLineWidth: 2,
gridLineColor: '#a0a0a0',
minorTickInterval: 3600 * 1000,
minorGridLineWidth: 1,
minorGridLineColor: '#d0d0d0'
},
yAxis: [{
min: 50,
max: 400,
minorGridLineWidth: 0
}, {
min: 0,
max: 30,
alignTicks: false,
opposite: true
}],
plotOptions: {
pointInterval: 3600000 // one hour
},
series: [{
name: 'spline',
yAxis: 0,
data: splineData
},
{
name: 'Bar',
type: 'column',
yAxis: 1,
pointWidth: 10,
data: barData
}
/* un-comment the following to see incorrect offset */
/******,
{
name: 'dummy',
type: 'column',
yAxis: 1,
pointWidth: 10,
data: emptyData
}
********/
]
});