Dash python 动态

问题描述 投票:0回答:2

我尝试在 python dash 上做一个仪表板。 我前端成功了。事实上,我出现了一个“年份选择器”,但我不明白如何根据今年选择器更改图表。有人有想法或解释吗?非常感谢。

#
# Imports
#

import plotly_express as px

import dash
import dash_core_components as dcc
import dash_html_components as html

#
# Data

if __name__ == '__main__':

    app = dash.Dash(__name__) # (3)
    

 
    fig = px.bar(df2, x="dpe", y="Percentage", color="signature")  # (4)


    app.layout = html.Div(children=[

                            html.H1(children=f'Répartition des Leads DEC',
                                        style={'textAlign': 'center', 'color': '#7FDBFF'}), # (5)
                            
                            html.Label('Year'),
                            dcc.Dropdown(
                            id="year-dropdown",
                            options=[
                            {'label': '2019', 'value': 2019},
                            {'label': '2020', 'value': 2020},
                            {'label': '2021', 'value': 2021},
                            {'label': '2022', 'value': 2022},
                            ],
                            value=2022,
                            ),

                           dcc.Graph(
                                id='graph1',
                                figure=fig
                            ), # (6)

                            html.Div(children=f'''
                                This a graph which show the repartition of the DPE
                            '''), # (7)

    ]
    )

    #
    # RUN APP
    #

    app.run_server(debug=False, port =4056) # (8)```
python plotly-dash dashboard
2个回答
0
投票

您需要使用回调来选择要显示的下拉列表。查看官方文档


0
投票

你需要使用回调来让你的图具有交互性:

  1. 将 dcc.Graph 更改为:
dcc.Graph(id='graph1',figure={})
  1. 回电
@app.callback(
    Output('graph1', 'figure'),
    [Input('year-dropdown', 'value')]
)
def update_graph_1(year_dropdown):
    df2 = df2[(df2['Year'] == year_dropdown)] 
    fig = px.bar(df2, x="dpe", y="Percentage", color="signature")
    return fig

© www.soinside.com 2019 - 2024. All rights reserved.