如何在Plotly图表中通过下拉菜单筛选DataFrame指定列数据

问题原因 #

你的代码基础逻辑是通顺的，筛选失效是三个细节问题导致的：

• update方法仅更新了折线的x/y数据，没有同步调整坐标轴的显示范围，切换到仅含单个数据点的类别时，数据容易落在默认坐标轴范围外无法展示
• 折线默认仅渲染连线，选中仅含单个数据点的类别时没有连线可渲染，看起来就像没有返回数据
• x、y数据没有按Plotly传参规范包裹列表，更新逻辑容易出现匹配异常

修复后完整代码 #

import plotly.graph_objects as go
import pandas as pd
budget = pd.DataFrame({"month":[9,9,10,10],
                       "year":[2020,2021,2020,2021],
                       "expense":[5,1,4,2],
                       "category":['groceries', 'gas', 'utilities', 'groceries']})

budget_fig = go.Figure()
# 增加markers显示，单数据点场景也能看到内容
budget_fig.add_trace(go.Scatter(x=budget.month, y=budget.expense, mode='lines+markers'))

budget_update_menu = []
budget_buttons = []

for cat in budget['category'].unique():
    df_filtered = budget[budget.category == cat]
    budget_buttons.append(dict(method='update',
                          label=cat,
                          args=[
                              # 第一个参数：更新trace的数据属性
                              {
                                  'x': [df_filtered.month.values],
                                  'y': [df_filtered.expense.values]
                              },
                              # 第二个参数：更新布局属性，自动适配坐标轴范围
                              {
                                  'xaxis': {'range': [df_filtered.month.min()-0.5, df_filtered.month.max()+0.5]},
                                  'yaxis': {'range': [0, df_filtered.expense.max()+1]}
                              }
                          ])
  )

budget_menu = dict()
budget_update_menu.append(budget_menu)
budget_update_menu[0]['buttons']=budget_buttons
budget_update_menu[0]['direction']='down'
budget_update_menu[0]['showactive']=True

budget_fig.update_layout(updatemenus = budget_update_menu)
budget_fig.show()

关键修改说明 #

• 给Scatter组件增加mode='lines+markers'配置，同时渲染连线和数据标记点，选中仅含单条数据的类别时也能正常展示内容
• 按钮的update参数补充了坐标轴范围适配逻辑，每次切换类别时自动根据筛选后的数据调整x、y轴的显示区间，避免数据落在可视区域外
• 给x、y数据外层包裹了列表，符合Plotly update方法的传参规范，避免更新匹配异常

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