Question

我一直在研究dynamic spline jsfiddle 在highcharts文档页面上。在那里，他们使用Math.random()更新数据并将其添加到系列中。

在文档中，我也知道如何一次性加载典型的csv files（或使用来自rapid highcharts的优秀代码：

function parseCSVData(csvFile) {
var data = [] 
var lines = csvFile.split("\n")
$.each(lines, function (lineNumber, line) {
    var fields = line.split(",");
    if (fields.length == 2){
        var timestamp = Date.parse(fields[0])
        var value = parseFloat(fields[1]);
        data.push([timestamp, value])
    }
})
return data}

）

我想做的是：

读取csv文件的一行
更新图表
暂停1秒
重做以上直到文件结尾

因此模仿实时应用程序。

但是，我不能简单地把它放在event : load之下，因为无法跟踪之前读过的行。他们实时提取数据的例子都使用某种api或websocket，这对我来说太先进了，无论如何都不适用于我的情况。
假设我的csv文件如下所示：（sample.csv）

t observed 1 19 2 12 3 28 4 17 5 85 6 22 7 86 8 16 9 90 10 93 11 39 12 96 13 42 14 74 15 100 16 22 17 41 18 32

有没有办法以相对简单的方式执行上述步骤？ my jsfiddle

Answer 1

如何为需要绘制的下一个数组索引维护变量？

setInterval(function () {
    if(window.nextIndex===undefined){
        window.nextIndex=0;
    }else{
        window.nextIndex++;
    }                        
    series.addPoint(data[window.nextIndex], true, true);
}, 1000);

Highcharts动态更新csv文件中的图表

1 个答案: