Dash中图表与年份、月份下拉框联动失效问题求助

以下是针对图表无内容显示的常见排查与修复方案：

1. 核对回调函数的输入输出映射 #

确保回调函数的Input、Output参数对应的组件ID，与页面布局中下拉框、图表的ID完全一致（包括大小写）。示例：

@app.callback(
    Output('daily-enrollment-chart', 'figure'),
    Input('year-dropdown', 'value'),
    Input('month-dropdown', 'value')
)
def update_chart(selected_year, selected_month):
    # 后续逻辑
    ...

需确认页面内下拉框ID为year-dropdown、month-dropdown，图表组件ID为daily-enrollment-chart，无拼写错误。

2. 验证数据过滤逻辑 #

检查回调中根据年份、月份过滤数据的代码是否正确，确保能拿到有效数据集：

def update_chart(selected_year, selected_month):
    # 先确保日期列是datetime类型
    df['date'] = pd.to_datetime(df['date'])
    # 过滤目标月份数据
    filtered_df = df[(df['date'].dt.year == selected_year) & (df['date'].dt.month == selected_month)]
    
    # 打印过滤结果，快速排查是否有数据
    print(filtered_df)
    
    # 处理空数据场景
    if filtered_df.empty:
        fig = go.Figure()
        fig.update_layout(
            title="该时间段无报名数据",
            annotations=[dict(text="未查询到对应月份的报名记录", x=0.5, y=0.5, showarrow=False, font={'size':16})]
        )
        return fig
    
    # 生成柱状图
    fig = go.Figure(data=[go.Bar(x=filtered_df['date'].dt.day, y=filtered_df['count'])])
    fig.update_layout(title=f"{selected_year}年{selected_month}月每日报名人数")
    return fig

重点确认：

• 日期列是否已转换为datetime类型，若为字符串需先做格式转换
• 下拉框返回的value类型（如字符串/整数）是否与过滤条件中的类型匹配，比如下拉框返回"2024"，则需用int(selected_year)转换后再与年份列比较

3. 检查下拉框选项值格式 #

确保下拉框的选项value属性与回调逻辑的类型要求一致：

# 示例：年份下拉框用整数作为value
dcc.Dropdown(
    id='year-dropdown',
    options=[{'label': str(year), 'value': year} for year in df['date'].dt.year.unique()],
    value=2024
)

如果下拉框返回的是字符串类型的年份/月份，回调中需先做类型转换再用于过滤。

4. 确认回调是否被触发 #

在回调函数开头添加打印语句，查看选中下拉框时是否有输出，判断回调是否正常执行：

def update_chart(selected_year, selected_month):
    print(f"选中年份：{selected_year}，选中月份：{selected_month}")
    ...

若没有打印输出，说明回调的输入输出映射存在问题，需重新核对组件ID。

5. 检查图表组件的布局渲染 #

确保dcc.Graph组件在布局中正确定义，无隐藏或样式错误：

dcc.Graph(id='daily-enrollment-chart', style={'width': '80%', 'margin': '0 auto'})

避免设置display: none等会隐藏组件的样式。

内容的提问来源于stack exchange，提问作者Sahil