Black Lives Matter. Please consider donating to Black Girls Code today.
Learn how to use COVID-19 data in open source Dash apps. Register for the Sept 23rd webinar with IQT!

[Solved] Unable to dynamically return a datatable

I previously had a Datatable and a Graph seperate but since they shared the same stock data I’m trying to combine the two.

When I try and return both a datatable and a graph it comes up blank. If i just return the Graph it appears and just the Datatable once again empty.

Here is some summary code.

app.layout = html.Div([
other stuff
html.Div(id=‘comps-analysis’),
], className=“container”)

@app.callback(
dash.dependencies.Output(‘comps-analysis’,‘children’),
[dash.dependencies.Input(‘stock-ticker-input’, ‘value’),
dash.dependencies.Input(‘events-select’, ‘values’),
dash.dependencies.Input(‘index-input’, ‘values’),
dash.dependencies.Input(‘index-input’, ‘options’),
])
def update_graph(tickers, events, index_values, index_options):
comps_df = pd.DataFrame(comps)
generates the graph and dataframe
return html.Div([
dcc.Graph(
id=‘comps_graph’,
figure={
‘data’: charts,
‘layout’: {
‘margin’: {‘b’: 0, ‘r’: 10, ‘l’: 60, ‘t’: 0},
‘legend’: {‘x’: 0}
}
}
),
dte.DataTable(
rows=comps_df.to_dict(‘records’),
columns=[‘Type’, ‘Company’, ‘High’, ‘Low’, ‘Performance’],
row_selectable=True,
sortable=True,
selected_row_indices=[],
id=‘comps-table’
),
])

Everything works when i keep it seperate but that involves downloading the same data twice.

See Comment #40 - Display tables in Dash

Thanks. Dash > Tableau…

1 Like