2

我目前必须在 8000 - 32000 点（4 行 * 8000 点）附近进行绘图，我通过 JSON 请求获取我的数据，实际上数据在不到一秒的时间内返回给我。但是，每当我到达 $.plot 点时，它就会冻结 IE8，并且需要永远加载那么多点。这是我的代码：

var data = [];

        function onDataReceived(seriesData) {
            var p = $.plot(placeholder, seriesData.seriesData, options);
        }
        $.ajax({
            url: '/Charts/LineChart?DataTypesToGraph=' + dataTypes + '&DatePull=' + chartDate + '&AssetID=' + $('#AssetID').val(),
            method: 'GET',
            async: true,
            cache: true,
            dataType: 'json',
            success: onDataReceived
        });

如何加快我的 $.plot 以使其加载速度更快。还有一种方法可以做到它不会冻结IE8吗？

非常感谢！

4

1 回答 1

4

您看到的是“冻结”，因为 Flot（尚）不支持增量绘图；它在将控制权交还给浏览器之前渲染整个绘图。除了破解代码之外，没有其他办法，但是您可以做两件事来提供帮助：

  1. 您可能正在使用 Excanvas；尝试切换到Flashcanvas。根据我的经验，它与 Flot 一样好用，并提供了显着更好的性能。获得“专业版”许可所需的 31 美元不会超出大多数预算。

  2. 每条线有 8000 个点，大多数显示最大宽度为 1920 像素，平均值更像 1280。如果你显示整条线，没有某种缩放/平移，那么你正在渲染 4-6比屏幕上实际可见的数据多倍。一些将点数降低到 2k 的服务器端过滤/聚合将显着提高性能。

但无论你做什么，你永远不会在 IE8 上获得大型数据集的出色性能。它是一个差不多有四年历史的浏览器，在 JavaScript 性能大战之前发布，使用模拟画布；你只能做这么多。

于 2012-09-26T18:09:52.763 回答