Auto-updating Graph: Callback is not being called using dcc.Location

@AlaaSenjab wrote:

Hi all,

I am sure its just stupidity , but callback is not working when it gets fired.
My use case, I have a graph that needed to be updated frequently. That works perfectly but not when it’s being used on multiple pages app. It works when i call it directly through app.layout.
Here is minimal code to reproduce the problem:

Here are just the navbar and page 1 and 2 layers. I also only initialized the an empty graph that will get its data from a callback later

app = dash.Dash(external_stylesheets=[dbc.themes.BOOTSTRAP])
navbar = html.Div([
	dcc.Link('go to page 1',href='/page-1'),
	html.Br(),
	dcc.Link('go to page 2',href='/page-2'),
])

page_1_layer = html.Div([
						dcc.Graph(id='graph_1'),
						dcc.Interval(id='graph_1_update',interval=60000),
					])

page_2_layer = html.Div([])

I am initializing a div to put the graph to. Note that i am calling page_1_content here just to show that it actually works if its called directly from the layout.

def Homepage():
	layout = html.Div([
		navbar,
		dcc.Location(id='url', refresh=False),
		html.Div(id='page-content'),
		page_1_content
	])
	return layout
	
app.layout = Homepage
app.config.suppress_callback_exceptions = True

@app.callback(Output('page-content', 'children'),
			 [Input('url', 'pathname')])
def display_page(pathname):
	if pathname == '/page-1':
		return page_1_layer
	else:
		return page_2_layer

finally, here is the graph that will need to be updated every minute

 @app.callback([ Output('graph_1', 'figure'),],
			  [ Input('graph_1_update', 'n_intervals')])
def update_first(n):
	trace = go.Scatter(
			x=[1, 2, 3, 4],
			y=[10, 11, 12, 13])
	layout = go.Layout()
	fig = [go.Figure(data=trace, layout=layout)]
	return fig

The output of page one is this:

Screen Shot 2020-02-18 at 5.41.06 PM2436×1672 148 KB

Thank you so much!

Posts: 1

Participants: 1

Read full topic