0

I am having issues with anychart with vue.js where UI freezes with data points that are spaced by couple of milliseconds and sometimes there are larger gaps.

Using xScale('datetime') fixes this issue but to be inline with previous UI I need to use xScale('scatter') which causes the slow rendering and UI freezing.

Package versions

Anychart: latest

Series: RangeArea

Simple code to reproduce the issue

Even with only 4 points it takes around 10s to render the chart. Increasing the TS (item1) of the last element in the array code increases rendering time even more.

Run the code here: https://playground.anychart.com/api/data/_samples/anychart.data.Table.addData

anychart.onDocumentReady(function () {
  // --- Function to provide data
  function getLocalData() {
    return [
      { item1: 1756719874033, item2: -0.004548928737640345, item3: 21.274999618530273 },
      { item1: 1756719874034, item2: 0.0033239805698394853, item3: 21.274999618530273 },
      { item1: 1756719874035, item2: -0.00489378213882441, item3: 21.274999618530273 },
      { item1: 1756719974035, item2: -0.004548928737640345, item3: 21.274999618530273 }
    //,
      //{ item1: 1762428309051, item2: -0.004548928737640345, item3: 21.274999618530273 }
    ].map(function (point) {
      return [point.item1, point.item2];
    });
  }

  // --- Get data from the function
  const data = getLocalData();

  // --- Create data table and add data
  const dataTable = anychart.data.table();
  dataTable.addData(data);

  // --- Map the data (timestamp, value)
  const mapping = dataTable.mapAs({ value: 1 });

  // --- Create chart and plot
  const chart = anychart.stock();
  chart.xScale('scatter');
  //chart.grouping().enabled(true).maxVisiblePoints(200);

  const plot = chart.plot();
  plot.line(mapping);

  chart.title('Custom Data from Function');
  chart.container('container');
  chart.draw();
});

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.