Black Lives Matter. Please consider donating to Black Girls Code today.

Add data to an existing trace using fileopt='extend'

I went to the above link and tried to implement the given code for “Add data to an existing trace”. I just copy pasted the code, used my api keys, and put in some different values and ran the program several times. I cannot get the fileopt=‘extend’ option to work as it is supposed to. I have tried it numerous ways. How does this functionality work? How do I implement it correctly in the simplest way possible?

My goal is to update a simple graph with new data without losing the existing data.

Thanks

2 Likes

Hi @mr.berry the link page is a legacy documentation page for using plotly on the cloud (online), we should have taken it down, sorry for the confusion. I expect you’re using a version of plotly >= 4.x, which works locally (no need for cloud access). Could you please explain more about what you want to do? Do you create a figure, display it, and later (as a consequence of which event?) you want to add new data?

1 Like

What I am trying to do is send new data to my graph and extend the trace. I create a graph out of some data, and then some time later I decide that more data should be added so I want to add that data but I don’t want to lose the data from earlier, I just want to extend the trace. This way, I don’t have to upload all the data at once every time because plotly limits upload sizes to 524.288 KB uploads at one time. I want to do incremental uploads that are all one continuous graph. The following is my code:

import Data as d
import plotly
import chart_studio.plotly as py
import plotly.graph_objs as go
import chart_studio

chart_studio.tools.set_credentials_file(username='zzzzzzzzzz', api_key='zzzzzzzzzzzzzzzzzzzzzz')

data_var = d.Data()

trace1 = go.Scatter(
    x=data_var.get_julian_date(),
    y=data_var.get_Ar(),
    xaxis='x1',
    yaxis='y1',
    marker=go.scatter.Marker(
        color='rgb(26, 118, 255)'
    )
)

data = [trace1]

layout = go.Layout(
    plot_bgcolor='#cbd0d6',
    paper_bgcolor='#cbd0d6',
    title=go.layout.Title(
        text=data_var.Ar,
        xref='paper',
        font=dict(
            family='Open Sans, sans-serif',
            size=22,
            color='#000000'
        )
    ),
    xaxis=go.layout.XAxis(
        title=go.layout.xaxis.Title(
            text='Julian Date',
            font=dict(
                family='Open Sans, sans-serif',
                size=18,
                color='#000000'
            )
        )
    ),
    yaxis=go.layout.YAxis(
        showexponent='all',
        exponentformat='e',
        title=go.layout.yaxis.Title(
            text='Ar',
            font=dict(
                family='Open Sans, sans-serif',
                size=18,
                color='#000000'
            )
        )
    )
)



fig = go.Figure(data=data, layout=layout)
py.plot(fig, filename='Ar')

bumping for visibility

Hi,

Any updates on this question? I’m running into a situation where I need to append a new data point to an existing time series every second, and update the trace in Plotly / Dash accordingly. What’s the canonical way to achieve this?

Please see:

1 Like

@ismirsehregal Thanks a bunch. I’m using Dash following official guide from here. However this is not exactly how it’s supposed to be done. Because that example reloads all the traces every time it updates the figure, which could be inefficient and possibly problematic if the data is big and the interval is short. In fact, the app is simply updating all the time and never really shows the new content In my case. Currently have no idea how to troubleshoot this issue.

Meanwhile, Is it possible if I set the interval to tens of millisecond (~50ms) when we plot a simple time series graph consisting of 100 data points? Or what is the limit of the speed of update?

I don’t know your usecase and the hardware you are working with, but 50 ms is quite a challenge I guess (idk if it’s possible). I’d usually batch update everything faster than ~300 ms.

I’m streaming sensors data from iot devices like gyroscope, accelerometer, etc. For example, Sensor data streaming with Arduino. It’s pretty fast but in JavaScript. I wonder how can this be implemented in the Python package.

Edit:
Github Source
He essentially Initializes a graph with Plotly.plot and Plotly.update the graph with new data coming out of the sensors, at the speed of roughly 20~30 fps.

Just saw this post. Some thoughts…

Probably the recommended option will be to use the dcc.Graph.extendData property as your callback output (as opposed to figure).

If you don’t want to reshape your data to fit the PlotlyJS extendTraces API (search for extendTraces(…) in the docs), you can also look at my somewhat clunky component dash-extendable-graph (https://github.com/bcliang/dash-extendable-graph – available as a pypi package), which supports keeps the figure.data format and also supports adding new traces.