破折号图不显示在页面加载和刷新时选择的默认下拉值

Question

我刚刚开始掌握 Dash，但遇到了一个我无法解决的问题。我试图在页面加载时将默认下拉值传递给折线图，但即使下拉菜单中存在该值，它也不会在图表中呈现：

不过，一旦我 select 另一个国家（地区），图表就会按预期工作：

如何使用我的默认下拉值（英格兰）加载图表？这是代码：

df_prices = pd.read_csv('Average-prices-2022-01.csv')
df_prices["Date"] = pd.to_datetime(df_prices["Date"])

app = JupyterDash(__name__, external_stylesheets=[dbc.themes.BOOTSTRAP])

app.layout = html.Div(children=[html.H1('My Dash App'), html.Br(),
                                html.Div(children=[html.H3('Select Country'), dcc.Dropdown(id='region_picker', options=[{"label":region, "value": region} for region in df_prices["Region_Name"].unique()], value='England' ,multi=True, clearable=True, style={'text-align':'left'})],  style={'display':'inline-block', 'vertical-align':'top', 'width':'25%', 'padding-right': '5px'}), 
                                html.Div(children=[html.H3("House Prices", style={'padding-left':'30px'}), dcc.Graph(id="price_chart")], style={'display':'inline-block', 'width':'75%'})], style={'margin': '50px'})

@app.callback(
    Output(component_id="price_chart", component_property="figure"),
    Input(component_id="region_picker", component_property="value")
)


def update_region(input_country):
    #input_country = 'England'
    data = df_prices.copy(deep=True)
    data = data[data['Region_Name'].isin(list(input_country))]
    
    line_chart = px.line(data_frame = data, x="Date", y="Average_Price", title=f'Average House Price in {input_country}',color='Region_Name', render_mode="webgl")
    return line_chart

谢谢！

Answer 1

当设置 multi 为 True 时，下拉组件的 'value' 属性必须是列表而不是字符串。只需将方括号括在值周围，如下所示，您就可以开始了：

dcc.Dropdown(id='region_picker', options=[{"label":region, "value": region} for region in df_prices["Region_Name"].unique()], value=['England'] ,multi=True, clearable=True, style={'text-align':'left'})

破折号图不显示在页面加载和刷新时选择的默认下拉值

Dash chart does not display default dropdown value selection upon page load and refresh

python

dashboard

plotly

plotly-dash