更新浮点时间序列图答案

【问题标题】：updating flot time series graph更新浮点时间序列图
【发布时间】：2012-08-14 22:49:57
【问题描述】：

我正在尝试构建一个时间序列图，其中 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 秒数？

【问题讨论】：

看到这个帖子：stackoverflow.com/questions/4758602/…

标签： javascript jquery flot

【解决方案1】：

您是否要并排绘制它们。如果是这样，这就是您想要的：

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

这将创建两个系列并将它们绘制在另一个之上。至于将数据滚动一秒钟，我建议查看this example

【讨论】：