Question

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

Answer 1

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

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

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

更新flot时间序列图

1 个答案: