javascript - 改善Highcharts折线图的性能

我正在使用Highcharts创建具有1440个数据点的可缩放折线图，这是其JSFiddle demo。

在Firefox中，图表的性能非常低下，渲染需要几秒钟，并且将鼠标悬停在数据点和出现工具提示之间会有很长的延迟。在我的页面上有几个这样的图表，它们的综合影响使该页面几乎无法使用。

是否有任何技巧/技巧可以提高具有相对较大数据集的图表的性能？我已经将图表的JSON附加到了这篇文章的末尾(数据本身被 chop 了)。

顺便说一句，在我添加turboThreshold: 0属性之前，该图表根本没有呈现，因为该系列具有1000多个数据点。根据the docs:

$(function () {
    $('#container').highcharts({

        chart: {
            type: 'line',
            marginRight: 10,
            zoomType: 'x'
        },

        xAxis: {
            type: 'datetime'
        },
        yAxis: {
            labels: {
                formatter: function () {
                    return currencySymbol + this.axis.defaultLabelFormatter.call(this);
                }
            },

            plotLines: [{
                value: 0,
                width: 1,
                color: '#808080'
            }]
        },
        tooltip: {
            formatter: function () {
                return Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) + '<br/>' + currencySymbol + Highcharts.numberFormat(this.y, 2);
            }
        },
        legend: {
            enabled: false
        },
        credits: {
            enabled: false
        },
        plotOptions: {
            series: {
                states: {
                    hover: {
                        lineWidthPlus: 0
                    }
                },
                lineWidth: 1,
                marker: {
                    enabled: false,
                    radius: 3
                }
            }
        },
        series: [{
            data: [{"y":93,"x":1412722800000},{"y":54,"x":1412722860000}],
            turboThreshold: 0
        }]
    });
});

更新

我updated the demo包含了到目前为止我收到的所有建议。禁用动画有所帮助，但是在Firefox(这是我定位的主要浏览器)中，页面仍然非常缓慢。我已开始提供赏金，希望能吸引更多建议。

最佳答案

在这里您可以找到FAQ回答您的问题。

附加说明:禁用工具提示时将获得巨大的性能提升。

或者只使用Highstock，它已经实现了dataGrouping，例如chart with 52k of points。

关于javascript - 改善Highcharts折线图的性能，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/26266578/