javascript - 绘制0到24小时时间序列的流程图

Question

现在我正在使用 flot 库。

我有一个绘制数据的函数，数据对象如下所示:

{ "data" : [[temperature1, temp2, temp3,..]] }

我只想将这个数组放在 0hour 和 24hour 之间，但我的代码不起作用，它只是在调用此 后卡住我的页面func(大概8000个点对客户端来说太复杂了)

格式应该是时间格式:"%h:%m"

function plotdata(data) {
var d1 = [];
var increment = 3600/data['data'][0].length;
for (var i = -2211663600; i < data['data'][0].length; i-=increment)  {
  d1.push([i, data['data'][0][i]]);
}

var options = {
    xaxes: [{
      mode: "time",
      timeformat: "%h:%m",
      axisLabel: 'time',
      min: (new Date(0, 0, 0, 00, 00, 00, 00)).getTime(),
      max: (new Date(0, 0, 0, 24, 00, 00, 00)).getTime(),

    }],
    yaxes: [{
        axisLabel: 'y-axis',
    }]
};

$.plot("#plot1d", [ d1 ], options);

提前致谢:)

Answer 1

你的循环从一个负数开始，递减，只有当它超过数组的长度时才结束，这是非负的。换句话说，循环永远不会结束；它甚至没有到达情节调用。

例如，如果数组中有 100 个温度，则循环实际上是:

for (var i = -2211663600; i < 100; i-=36)  {

一旦你解决了这个问题，绘制 8000 点，正如 Raidri 指出的那样，仍然会相对缓慢；根据机器的不同，从几百毫秒到几秒不等。如果您计划在图上进行任何类型的实时交互(平移、缩放等)，则应提前下采样。<​​/p>