Incubator-echarts: Echarts is flushing values when we resume live charts

Created on 12 Oct 2018  ·  4Comments  ·  Source: apache/incubator-echarts

One-line summary [问题简述]

https://ecomfe.github.io/echarts-examples/public/editor.html?c=dynamic-data
Open this live chart example and go to another tab for 10 seconds. When you switch back to the
live chart tab say after 10 seconds, it will suddenly draw all the chart lines that were to come live second by second. This has some serious implications in Alarm & Events applications.

details of the problem:

In our one application we are taking current machine time for every value received over mqtt web socket connection. For example with one second interval we receive 4,5,6,7 and attach value received time with the value, they become e.g. [4, 10s],[4, 11s],[6, 12s],[7, 13s]. I update echart options at every message received. But the problem I am facing is that if the browser tab is in background, echarts would render all these points together at once I switch back to chart tab. This is same for both time and category axis type. I don't know is this a problem with the canvas rendering or the echarts.

Version & Environment [版本及环境]

  • ECharts version [ECharts 版本]: v4.2.0.rc
  • Browser version [浏览器类型和版本]: Chrome, Firefox, doesn't matter
  • OS Version [操作系统类型和版本]: Ubunut & Windows, doesn't matter

Expected behaviour [期望结果]

Echart should be rendering to canvas in real time when the values are received, and we called chartInstance.setOption() instead of flushing all values at once, if tab is hidden.

not-related

All 4 comments

This is not a problem with ECharts. You should manage the data and understand the relationship with setInterval. By calling chart.setOption, it just updates the data you give. So just make sure you give it the right data you wish.

@Ovilia try to open this sample and switch tab and come back after 10 seconds, you will feel all the ten second values flushed at once, even the setOptions was being called every second. https://ecomfe.github.io/echarts-examples/public/editor.html?c=dynamic-data

With some more search on the topic, I think background tab throttling could be the reason for this. Read here https://developers.google.com/web/updates/2017/03/background_tabs

@ahmadalibaloch Thank you for your feedback, I will continue to follow up on this issue.

Was this page helpful?
0 / 5 - 0 ratings