✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
🐇 Announcing Dash VTK for 3d simulation graphics. Check out the March webinar.

Dash Interval not working correctly

Hey, I am trying to use Dash Interval to periodically update a map. However, I am having trouble even getting a minimal viable example working. I tried the code below, based on here, but the graph in the browser does not update continuously. It does update when I refresh the browser, but even then, very slowly.

(NOTE: I was having the same issues w/ the example on the Dash website here)

Please help, Thanks!

import dash
from dash.dependencies import Output, Input
import dash_core_components as dcc
import dash_html_components as html
import random
from collections import deque

X = deque(maxlen=20)
Y = deque(maxlen=20)

app = dash.Dash(__name__)
app.layout = html.Div(
        dcc.Graph(id='live-graph', animate=True),

@app.callback(Output('live-graph', 'figure'),
              [Input('graph-update', 'interval')])
def update_graph_scatter(i):

    data = {
            'x': list(X),
            'y': list(Y),
            'name': 'Scatter',
            'mode': 'lines+markers'

    return {'data': [data],
            'layout' : {'xaxis': dict(range=[min(X),max(X)]),
                        'yaxis': dict(range=[min(Y),max(Y)])}

if __name__ == '__main__':

How often do you need it to update?

Every 1 second is ok

To get an update every second, set the interval property of the Interval component to 1000 (unit is ms). With you current setting, you will get 100 updates per second, which is a lot.

The reason that your example is not working is that your input is attached to the wrong property of the Interval component. It should be n_intervals (the property which changes), not interval (the property that determine how often n_intervals changes).

Awesome, this worked. Thank you!