更新 FLOT 时间序列图

updating flot time series graph

本文关键字：时间序列 FLOT 更新      更新时间：2023-09-26

我正在尝试构建一个时间序列图，其中x轴表示时间，y轴表示[0,100]中的数字。我有一个实时数据流，它为下一个时间序列点提供 [x，y] 坐标。尝试使用flot，我意识到每次情节发生时，以前的情节都会被删除，只留下新的情节，我如何将新点"附加/渲染"到旧情节中。

例如，在下面的代码中： 

    $(function () {
        var d1 = [];
        for (var i = 0; i < 14; i += 0.5)
            d1.push([i, Math.sin(i)]);
        var d2 = [[0, 3], [4, 8], [8, 5], [9, 13]];
        // a null signifies separate line segments
        var d3 = [[0, 12], [7, 12], null, [7, 2.5], [12, 2.5]];

        $.plot($("#placeholder"), [ d2 ]);
        $.plot($("#placeholder"), [ d1 ]);

    });
将绘制 D2，

但随后 D1 将覆盖 D2 图。如何将新点附加到绘图以及如何更新 x 秒数？

你想并排绘制它们吗？如果是这样，这就是您想要的：

$.plot($("#placeholder"), [ d2, d1 ]);

这将创建两个系列并将它们绘制在彼此之上。 至于将数据滚动一秒钟，我建议看看这个例子

相关文章：