Python Plotly如何通过下拉按钮更新多个散点图的数据？

问题原因 #

每遍历1列会新增2条散点轨迹（分别对应Scenario 3和Original两组数据），8列总共有16条轨迹，你原代码中visible数组长度仅为8，且仅设置1个位置为可见，导致切换选项时轨迹显示逻辑完全错误。

修改后的完整代码 #

import numpy as np
import pandas as pd
from plotly import graph_objects as go

scen3_df = pd.DataFrame(np.random.randint(10, 20, (100, 8)), columns=['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'])
orig_df = pd.DataFrame(np.random.randint(0, 10, (100, 8)), columns=['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h'])

first_col = scen3_df.columns.to_list()[0]
traces = []
buttons = []
for idx, col in enumerate(scen3_df.columns):
    # 总共有8列*2=16条轨迹，visible数组长度改为16
    visible = [False]*16
    # 每列对应两条轨迹，下标为2*idx 和 2*idx+1，设为可见
    visible[2*idx] = True
    visible[2*idx + 1] = True

    traces.append(go.Scatter(x=scen3_df.index, y=scen3_df[col],
                             name="Scenario 3",
                             visible = True if idx==0 else False,
                             ))

    traces.append(go.Scatter(x=scen3_df.index, y=orig_df[col],
                             name="Original",
                             visible = True if idx==0 else False,
                             ))

    buttons.append(dict(label=col,
                        method="update",
                        args=[{"visible": visible},
                              {"title": f"Gate operation at {col}"}]
                        ))


updatemenus = [{'active':0, "buttons":buttons}]

fig = go.Figure(data=traces,
                 layout=dict(updatemenus=updatemenus))
# 初始标题和按钮切换后的格式保持一致
fig.update_layout(title=f"Gate operation at {first_col}", title_x=0.5)
fig.update_yaxes(range=[0, max(scen3_df.max().max(), orig_df.max().max())], title="Gate Height (m)")
fig.update_xaxes(title="Time (Julian Day)")
fig.show()
fig.write_html("gate_operations.html")

核心修改点 #

• 将visible数组的长度从8改为16，匹配实际总轨迹数
• 每个选项对应的可见位置改为当前列对应的2条轨迹的下标，保证两组散点同时显示
• 优化了y轴范围的取值逻辑，同时兼容两个数据集的最大值，避免数据超出显示范围

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