I’m trying to build a dashboard for work where when I click one of the two options, the graph’s y-axis (and z for the 3d plot) will update. I have tried following the documentation and just can’t figure it out. This step is the last for this project, and I would love to finish it. I hope y’all can help.
app.layout = html.Div(children = [ # Full page container
html.Div([ # Header
html.Div([], className = 'col-2'),
html.Div([
html.H1(children='KSAT 12 Dashboard',
style = {'textAlign':'center', 'padding-top' : '1%'},
className = 'col-12')]),
]),
html.Div([
dcc.RadioItems(
id='yaxis-column',
options=[{'label': i, 'value': i} for i in ['Median Open Rate(%)', 'Median Click Rate (%)']],
value='Linear',
labelStyle={'display': 'inline-block'}
)
],
style={'width': '48%', 'display': 'inline-block'}),
html.Div([
html.Div([
dcc.Graph(id = 'timeWindow',figure = fig1),
], className = 'six columns'),
html.Div([
dcc.Graph(id='3dScatPlot', figure = fig4),
], className = 'six columns'),
], className='row'),
html.Div([
html.Div([
dcc.Graph(id = 'trends',figure = fig5),
], className = 'six columns'),
html.Div([
dcc.Graph(id='wordAnalysis', figure = fig8),
], className = 'six columns'),
], className='row'),
])
# Callbacks
@app.callback(
Output('timeWindow', 'figure'),
Output('3dScatPlot', 'figure'),
Output('trends', 'figure'),
Output('wordAnalysis', 'figure'),
Input('yaxis-column', 'value'))
def update_graphs(yaxis_column_name):
fig1 = px.bar(time, x = 'Hour', y = 'Median Open Rate (%)' if yaxis_column_name == 'Median Open Rate (%)' else 'Median Click Rate (%)',
facet_col='Weekday', color = "Sends", facet_col_wrap=4,facet_col_spacing=0.1, facet_row_spacing=0.15,
title = 'Time Windows', width = 625, height = 500)
fig4 = px.scatter_3d(time2, x = 'Weekday', y = 'Hour', z = 'Median Open Rate (%)' if yaxis_column_name == 'Median Open Rate (%)' else 'Median Click Rate (%)',
color = 'Newsletter',
title = '3D Time Analysis', width = 625, height = 500)
fig5 = px.bar(trend, x = 'Newsletter', y = 'Median Open Rate (%)' if yaxis_column_name == 'Median Open Rate (%)' else 'Median Click Rate (%)', color = 'Median Mail Score',
title='Category Efficiency', width = 625, height = 500)
fig5.update_layout(barmode='stack', xaxis={'categoryorder':'total ascending'})
fig8 = px.bar(subject, x = 'First Word', y = 'Median Open Rate (%)' if yaxis_column_name == 'Median Open Rate (%)' else 'Median Click Rate (%)', color = 'Count',
title = 'First Word Analysis', width = 625, height = 500)
fig8.update_layout(barmode='stack', xaxis={'categoryorder':'total ascending'})
return fig1, fig4, fig5, fig8