Plotly Dashboard：如何制作一个简单的下拉菜单来显示数字？答案

【问题标题】：Plotly Dashboard: How to make a simple dropdown to display figures?Plotly Dashboard：如何制作一个简单的下拉菜单来显示数字？
【发布时间】：2022-01-13 06:02:45
【问题描述】：

我的数据保存在字典中，并且可以访问，但我不知道该放什么选项和价值。

app = JupyterDash(__name__)
app.layout = html.Div([
    dcc.Dropdown(
        id='launch-data',
        options=[
            {"label":"All","value":"launch_tot_fig"}],
            value=launch_tot_fig
            ),
        

    html.Div(id="dd-output-container")]
    )

@app.callback(Output('dd-output-container', 'children'),Input('launch-data', 'value'))
def update_output(value):
    return 'You have selected "{}"'.format(value)
if __name__ == '__main__':
    app.run_server(debug = True)

我还有一个图 launch_tot_fig，它是发射场的饼图。这就是在输入为“All”时显示。

The Dictionary is launchmass with the SPACEX launchsites as keys

【问题讨论】：

标签： plotly-dash dashboard

【解决方案1】：

如果你想显示一个图表，你需要在你的布局中添加一个图表组件，然后使用回调来更新它给定下拉值。你应该有这样的东西：

app.layout = html.Div([
    dcc.Dropdown(
        id='launch-data',
        options=[
            {"label": "All", "value": "launch_tot_fig"}, {"label": "Other", "value": "Other"}],
        value="Other"
    ),

    html.Div(id="dd-output-container"),
    
    dcc.Graph(id='my-fig')

]
)

回调应该是这样的：

@app.callback(Output('my-fig', 'figure'),
              Input('launch-data', 'value'))
def update_output(value):

    fig = px.bar()

    if value == 'launch_tot_fig':
        fig = dictionnary_with_graphs['launch_tot_fig']

    return fig

【讨论】：