Question

我需要在图表上显示10个系列的400,000点。当我使用Highcharts显示1个2-3百万点的系列时，它工作正常（需要3000毫秒来渲染，这对于那么多数据来说很棒）。

当我尝试使用400,000个点进行多个系列时，我设法获得4个系列，当我添加第5个时，我的浏览器冻结在100个CPU上（在chrome中，计算机的CPU为50％）。

我正在使用boost.js进行gpu渲染。

这是一个错误，在一个系列中它可以渲染数百万个点而不是多个系列并且数据被分割？

我尝试减少数据，5个系列的50,000点不起作用，5个10,000个工作正常，7个10,000个工作正常。使用多个数据系列

似乎存在性能问题

您知道解决方法吗？

继承我的代码 - 没有做任何特别的事情。 snapshotData有400,000个点，X轴数据是小数点（20.018489,20.02048，...）（如果由于某种原因这很重要）

snapshotData.forEach(atom => {
      data.push([atom.X, atom.Y]);
      data2.push([atom.X, atom.Y+ 20]);
      data3.push([atom.X, atom.Y+ 50]);
      data4.push([atom.X, atom.Y- 60]);
      data5.push([atom.X, atom.Y+ 140]);
    });

    Highcharts.stockChart('chartContainer', {
      chart: {
        zoomType: 'x'
      },
      boost: {
        useGPUTranslations: true
      },
      title: {
        text: 'Highcharts drawing ' + data.length + ' points'
      },
      subtitle: {
        text: 'Using the Boost module'
      },
      tooltip: {
        valueDecimals: 2
      },
      series: [{ data: data }, { data: data2 }, { data: data3 }, { data: data4 }, { data: data5 }]
    });

更新

使用图表组件而不是stockChart使它可以使用10个大型系列，但在放大/缩小（100％cpu的5-10秒）时具有主要处理时间，这比使用stockChart的选项卡崩溃更可行我需要stockChart：/

Highcharts，多个大型系列不渲染

0 个答案: