javascript - 限制 HighCharts 中的数据点数量

Question

当向空 HighChart 图表添加新点时，图表上的点数会无限增加，并且随着 X 轴范围变大，图表会水平压缩。

myChart.series[1].addPoint([fields.timestamp, fields.score], true, true);

但是，当向非空图表添加更多数据点时，图表会立即向左滚动以容纳新数据点，而不更改 x 轴刻度。一个例子是 http://www.highcharts.com/demo/dynamic-update 。任何一次显示的数据点数量似乎都是加载图表时图表上已有的数据点的原始数量。

问题:对于这两种情况，我们如何更改/限制图表上的数据点数量(或限制 x 轴刻度)，以便从空开始的图表会增加在添加更多数据点导致图表向左滚动之前，数据点数量达到 N 点。

Answer 1

如果你看docs您可以看到可以将属性添加到series.addPoint。扩展this例如，您可以像这样修改按钮代码:

// the button action
var i = 0;
$('#button').click(function() {
    var chart = $('#container').highcharts();
    chart.series[0].addPoint(50 * (i % 3), true, chart.series[0].points.length > 15, true);
    i++;
});

我已添加 chart.series[0].points.length > 15 到其中。此示例从图表上已有 12 个点开始(因此长度为 11)。我将继续添加点，直到图表上有 16 个点，然后添加任何新点，并删除左侧的最后一个点。