How to remove points from the start of the plotted trace data

I am receiving data being sent live from a piece of hardware that is running continuously. Right now I start with a blank scatter plot and I’m calling Plotly.extendTraces to append the new data to the plot. This works great. However as you may imagine, since the data just keeps coming in, my plot just gets more and more data. What I need is to be able to purge the oldest plotted values when new values are appended, so that I have a moving window in time displayed in the plot.

How do I delete data from the start of the trace to achieve this?

I created this codepen:

See https://plot.ly/javascript/plotlyjs-function-reference/#plotlyextendtraces

For example, calling

// extend multiple traces up to a maximum of 10 points per trace
Plotly.extendTraces(graphDiv, {y: [[rand()], [rand()]]}, [0, 1], 10)

keeps only the most recent 10 points.

1 Like

perfect, I totally missed that when looking at the docs.

1 Like

I have a similar quandary, but in lieu of extending the trace and limiting by number of points, is it possible to limit based on the age determined by the x-axis time series? So for example I want only the last 30 minutes of data to be traced. It appears the range might be ignored with extendTraces or is not able to be a dynamic datetime?

1 Like

@jneilliii same here, we can’t know the number of samples in a time window and we have to display them all while letting new samples in and purging the old ones as they move out of the time window. Currently doing this via Plotly.react, but this updates the whole dataset and a side effect is that zooming becomes jerky