javascript - 定期更新 Highcharts 系列数据后浏览器崩溃

Question

我有一个带有实时图表的应用程序。每 10-15 秒就会有新数据可用，并且 AWS S3 URL 通过 Web 套接字发送到浏览器。

回调获取CSV文件的S3 url，并使用papaparse下载和处理数据。检查 Chrome 开发工具，JavaScript 对象计数持续增加，我假设这与浏览器崩溃有关。这是回调:

注意:initialData 是一个具有默认系列属性的数组，其中包括一个空的“数据”属性

var shotCallback = function (data) {
                if (hchart.series.length) {
                    for (var i = 0; i <= hchart.series.length - 1; i++) {
                        hchart.series[i].setData([]);
                    }
                    hchart.redraw();
                } else {
                    initialData.forEach(function (item, i) {
                        hchart.addSeries(angular.extend({}, initialData[i]), false);
                    });
                }
                Papa.parse(data.url, {
                    download: true,
                    fastMode: true,
                    worker: true,
                    dynamicTyping: true,
                    skipEmptyLines: true,
                    step: function (results) {
                        if ( ! firstRow) { // first row has column names
                            results.data[0].forEach(function (item, i) {
                                if (i > 0 && i <= initialData.length) {
                                    hchart.series[i - 1].addPoint(item, false);
                                }
                            })
                        }
                        firstRow = false;
                    },
                    complete: function () {
                        hchart.redraw();
                    }
                });
            };

这会加载数千个数据点，但性能相当不错。

我的问题是:当我清除以前的数据集时，我是否使用 .setData([]) 正确执行了操作，还是应该以不同的方式执行此操作？

浏览器继续崩溃，我不知道下一步该怎么做。

感谢任何帮助。

Answer 1

我正在运行 HighCharts 4.2.5 并升级到 5.0.10，它解决了问题。我遇到过一些帖子，指出版本 4 存在一些内存泄漏。