How to connect multiple outputs to callbacks?

Question

I'm trying to create a dashboard with a dropdown menu, with each menu item, when selected, loads 2 figures. I did the following but the output figures are the same no matter what I select in the dropdown. When I selected '3 Day Forward Return', I want it to show fig 11 and fig 12.

app = dash.Dash()

fig_names = ['1 Week Forward Return','3 Day Forward Return', 'Next-Day Forward Return ']

fig_dropdown = html.Div([
    dcc.Dropdown(id='fig_dropdown',options=[{'label': x, 'value': x} for x in fig_names])])


fig_plot1 = dcc.Graph(id='macdwkly',figure = fig1, style={'display': 'inline-block'})
fig_plot2 = dcc.Graph(id='rsiwkly',figure = fig2, style={'display': 'inline-block'})

app.layout = html.Div([fig_dropdown, fig_plot1,fig_plot2])

@app.callback(Output('fig_plot', 'children'),
                [Input('fig_dropdown', 'value')])
def update_output(fig_name):
    return name_to_figure(fig_name)

def name_to_figure(fig_names):
    figure = go.Figure()
    if fig_name == '1 Week Forward Return':
        fig1 = px.scatter(dfx, x=dfx.MACD, y=dfx.Wkly_FR, color=dfx['wkly_gt_0'])

        fig2 = px.scatter(dfx, x=dfx.RSI, y=dfx.Wkly_FR, color=dfx['wkly_gt_0'])

    elif fig_name == '3 Day Forward Return':
        fig11 = px.scatter(dfx, x=dfx.MACD, y=dfx.Three_d_FR, color=dfx['tred_gt_0'])
     
        fig12 = px.scatter(dfx, x=dfx.RSI, y=dfx.Three_d_FR, color=dfx['tred_gt_0'])
      
        return dcc.Graph(figure=figure)


if __name__ == '__main__':
    app.run_server()

Answer 1

You should correct Output('fig_plot', 'children') to :

[Output('macdwkly', 'figure'),Output('rsiwkly', 'figure')]

Accordingly, the return of name_to_figure should return two figures:

def name_to_figure(fig_names):
...
...
...

return (fig1 , fig2)

• Also rename all variables inside name_to_figure to fig1 and
  fig2 inside the if-else statements.
• Also correct the variable name fig_name to fig_names inside the conditions of if-else statements.
• No need for go.Figure because you use px.scatter, instead.