Question

我希望能够拥有多个实时flot图表。我让它使用一个flot图表，其中所有内容都通过此功能实时更新：

        function updateOnce(plot)
        {
            plot.setData([{ label: 'G-force', data: getRandomData(), lines: { show: true } }]);
            plot.setupGrid();//sensorPlots[i]
            plot.draw();

            setTimeout(function () { updateOnce(plot); }, 30);
    }

现在我遇到的问题是我动态生成plot并将其添加到数组中。如何设置这种类型的函数来迭代每个数组并为数组中的每个绘图运行此函数而不影响其他数组？

我试过这个：

        function updateOnce()
        {
            $.each(sensorPlots, function (i, val) {
                val.setData([{ label: 'G-force', data: getRandomData(), lines: { show: true } }]);
                val.setupGrid();//sensorPlots[i]
                val.draw();
                setTimeout(updateOnce, 30);
            });

        }

sensorPlots is an array filled with `plots`

但是这会导致我的图表随着我添加的每个plot越来越快地移动。

Answer 1

问题似乎是每次运行超时功能时都会为每个绘图声明一个新的超时。这将导致调用函数的频率呈指数增长，这非常糟糕...如果你这样做会怎么样：

function updateOnce() {
    $.each(sensorPlots, function (i, val) {
        val.setData([{ label: 'G-force', data: getRandomData(), lines: { show: true}}]);
        val.setupGrid();//sensorPlots[i]
        val.draw();
    });
    setTimeout(updateOnce, 30);        
}

updateOnce();

SetTimeout用于多个实时flot图表

1 个答案: