Hello,
I am relatively new to dash and I am designing an app having two callbacks. This app is supposed to pull data from a database about inventories, then a heatmap is plotted below showing some statistics of the inventory.
The user can select the name of an inventory but this one is already filled by default.
First callback looks at the name of this inventory and fetch the data, do some data cleaning and output the result in a dash table.
This part works fine. I also want to leave the user the option of filtering the data via the native filter action within the table displayed.
Things got messy when I added the second callback that takes the dash table data as input and plot a heatmap from it. When debugging my code, the application does no longer enter in the first callback and enter in the second one while the inventory table is empty. This is not a problem in itself but then the app stops there and I really don’t understand why the first callback is not called anymore, it is possible to call it manually by removing the default value and entering it again but I would have expected for the app to work with the default value, especially given that it worked this way before adding the heatmap.
Below is the code:
html.Div([
html.H4('Inventory'),
dcc.Dropdown(id='app-dropdown-inventory',
options=[{'label': l, 'value': v} for (v, l) in INVENTORIES_DICT],
value='inventory_default',
),
html.Div([dash_table.DataTable(
id='inventory-table',
data=[{}],
columns=[
{"name": i, "id": i} for i in INVENTORY_COLUMNS
],
page_action='native',
filter_action='native',
sort_action='native',
editable=True,
selected_rows=[],
)])
], className='row'),
html.Div([
html.H2('Heatmap'),
dcc.Graph(
# dummy heatmap
id='heatmap',
figure={
'data': [go.Heatmap(
z=[[1, -1], [0.5, -0.5]],
x=[0, 1],
y=[0, 1],
)],
})
])
@app.dash_app.callback(
Output('inventory-table', 'data'),
[
Input('app-dropdown-inventory', 'value'),
]
)
@app.dash_app.log_error
def update_portfolio_table(inventory_name):
# external function called to get inventory, tested separately and works fine
df = get_inventory(inventory_name)
return df.to_dict('row')
@app.dash_app.callback(
Output('heatmap', 'figure'),
[
Input('inventory-table', 'data'),
]
)
@app.dash_app.log_error
def update_heatmap(portfolio):
# I have just written a dummy heatmap down there to test the code
return {
'data': [go.Heatmap(
z=[[1, -1], [0.5, -0.5]],
x=[0, 1],
y=[0, 1],
)],
}