Question

以下设置将Highcharts上的x轴范围设置为过去一小时：

xAxis: {
    min: new Date().setHours(new Date().getHours() - 1), // last hour
    max: new Date().getTime()),                          // now
},

然而，每隔几秒就会添加更多数据点。如何使x轴动态化以使刻度更新为新数据点，仅显示过去一小时？

Answer 1

动态添加积分时，您可以使用Axis.setExtremes（API）同时更新x轴。例如：

// Add new (random) point
chart.series[0].addPoint(Math.floor(Math.random() * 100));

// Update x-axis range
chart.xAxis[0].setExtremes(new Date().getTime(), new Date().setHours(new Date().getHours()+1));

请参阅this JSFiddle进行类似演示。

Answer 2

你看过Highstock吗？ http://www.highcharts.com/stock/demo。也许它更适合你正在做的事情

但在Highchart上你可以像这样更新最小值：

chart.xAxis[0].update({
    min: new Date().getTime(),
    max: new Date().setHours(new Date().getHours()-1),
});

Answer 3

1）看起来你倒退了（最多应该是＆＃39;现在＆＃39;，min应该是-1小时）

2）实际问题是什么？什么不起作用？

如果适当设置最小值/最大值，则仅显示最小值和最大值内的数据。

您还应该只将数据发送到您要显示的时间范围内的图表。否则，您最终会发送大量不需要的数据。

看看＆＃39;转变＆＃39; addPoint（）方法的属性：

http://api.highcharts.com/highcharts#Series.addPoint

另请参阅setData（）方法：

http://api.highcharts.com/highcharts#Series.setData

在Highcharts中设置动态x轴范围

3 个答案: