3

我试图一次绘制 6 个时间序列，并每隔几毫秒更新一次它们的值。

这是我最初绘制工作正常的数据的方式：

var d1 = [];
var d2 = [];
var d3 = [];
var d4 = [];
var d5 = [];
var d6 = [];

d1 = getRandomData(d1, totalPoints);
d2 = getRandomData(d2, totalPoints);
d3 = getRandomData(d3, totalPoints);
d4 = getRandomData(d4, totalPoints);
d5 = getRandomData(d5, totalPoints);
d6 = getRandomData(d6, totalPoints);

var plot = $.plot("#placeholder", [{
data: d1,
lines: { show: true, fill: false }
}, {
data: d2,
lines: { show: true, fill: false }
}, {
data: d3,
lines: { show: true, fill: false }
}, {
data: d4,
lines: { show: true, fill: false }
}, {
data: d5,
lines: { show: true, fill: false }
}, {
data: d6,
lines: { show: true, fill: false }
}]);

但我的更新功能不起作用：

function update() {

d1 = getRandomData(d1, totalPoints);
d2 = getRandomData(d2, totalPoints);
d3 = getRandomData(d3, totalPoints);
d4 = getRandomData(d4, totalPoints);
d5 = getRandomData(d5, totalPoints);
d6 = getRandomData(d6, totalPoints);

plot.setData([d1, d2, d3, d4, d5, d6]);

// Since the axes don't change, we don't need to call plot.setupGrid()
plot.draw();
setTimeout(update, updateInterval);

}
//update();

当我取消注释并调用update()时，图表变为空白。但我知道数据在没有调用的情况下最初加载得很好。

如何更新我的 d 数组并正确重绘图形？谢谢。

4

1 回答 1

6

setData和 data 参数plot都采用相同方式格式化的数据。

因此，创建一个可重用的函数：

 getSeriesObj = function() {
   return [
    {
      data: getRandomData(d1, totalPoints),
      lines: { show: true, fill: false }
    }, {
      data: getRandomData(d2, totalPoints),
      lines: { show: true, fill: false }
    }, {
      data: getRandomData(d3, totalPoints),
      lines: { show: true, fill: false }
    }, {
      data: getRandomData(d4, totalPoints),
      lines: { show: true, fill: false }
    }, {
      data: getRandomData(d5, totalPoints),
      lines: { show: true, fill: false }
    }, {
      data: getRandomData(d6, totalPoints),
      lines: { show: true, fill: false }
    }
  ];
}

对于初始情节：

var plot = $.plot("#placeholder", getSeriesObj());

要重置您的数据：

plot.setData(getSeriesObj());
plot.draw();

这是一个 jsFiddle 演示。

于 2013-09-12T23:18:00.680 回答