Realtime graph and react function performance

plotly.js
1

Hello,

I am making a dashboard like application using VueJS where I am plotting sensor data along with a bunch of other things. Initially when I added only one graph with scattergl type, it was updating very smoothly. But when I start adding more graphs (mostly of scatter type), the performance of the real time graph seems to be deteriorating. Here is the frequency of new data points:

5 graphs - 20 Hz (50 samples per seconds, the trace data of last 3 minute is kept/drawn)
23 graphs - 0.5 Hz ( 2 samples per seconds - the trace data of last one hour is kept/drawn)

The 23 graphs work fine as their update rate is 0.5Hz. However the remaining 5 starts showing very slow performance after 5 to 10 minutes.

These are the things I have tried up until now:

1 - Initially I was plotting a complete 1-hour of sensor data on those 5 graphs (with 20Hz of frequency). But it was very very slow so I switch to plotting on last 3 minute. I used array shift function to pop out the remaining elements

2 - I tried to use scattergl type as well as pointcloud type. Both of them are not updating fast.

3 - The sensor data is like a sine wave (it is a CO2-gas measuring device) and I am not sure ‘thinning’ the data would be very effective.

So I wanted to ask,

1 - What is the update rate of ‘react’ function. It is faster/slower than extendTrace? Can someone provide a ball-park number (i.e. its update rate) so I can slow down the sensor data acquisition rate to make it look like real time graphing

2 - Are there any other methods/trick that I could use to increase the performance?

Thank you

Arsh

2

Browsers all have caps on the number of WebGL contexts that can be used. I think most or all of them are capped at 16 per browser tab. I also believe Plotly uses 2 contexts per plot. So I’m not even sure how you’re displaying 23 scattergl plots at once. If there’s some sort of context switching going on, that could possibly be the cause (or at least contributing to it).

3

@brian428 Thank you for the response.

I am plotting 28 graphs.
23 of the plots are ‘scatter’ type not ‘scattergl’ type.
Remaining 5 graphs are scattergl type which are causing problem (jerky update in plotting).