基于Dash/Plotly实现choropleth图下拉菜单切换CSV多列数据
Plotly choropleth地图添加下拉切换字段方案
以下是修改后的完整代码,你只需要将代码中可切换字段配置部分的字段名、色阶、数值范围替换为你实际的另外两列字段的对应参数即可:
import pandas as pd import plotly.express as px # 加载数据 df = pd.read_csv("ALLCOUNTRIES-PREDICTED.csv", header=0, encoding="utf-8") # -------------------------- 可切换字段配置,按需修改 -------------------------- # 三个元素分别对应 New Cases、你的另外两个字段,可修改显示名称、列名、色阶、数值范围 switch_conf = [ {"show_name": "新增病例", "col_name": "New Cases", "color": "Reds", "value_range": [0, 10000]}, {"show_name": "替换为你的字段1显示名", "col_name": "替换为你的字段1列名", "color": "Blues", "value_range": [0, 50000]}, {"show_name": "替换为你的字段2显示名", "col_name": "替换为你的字段2列名", "color": "Greens", "value_range": [0, 2000]} ] # --------------------------------------------------------------------------- # 生成初始地图(默认加载第一个配置的字段) fig = px.choropleth(df, locations="iso_alpha_3", color=switch_conf[0]["col_name"], hover_name="Country", animation_frame="Date", projection="equirectangular", color_continuous_scale = switch_conf[0]["color"], range_color=switch_conf[0]["value_range"] ) # 配置下拉菜单按钮 buttons = [] for conf in switch_conf: buttons.append( dict( label=conf["show_name"], method="update", args=[ # 第一部分:修改轨迹属性 {"z": [df[conf["col_name"]]]}, # 第二部分:修改颜色轴配置 { "coloraxis": { "colorbar": {"title": conf["show_name"]}, "colorscale": conf["color"], "cmin": conf["value_range"][0], "cmax": conf["value_range"][1] } }, # 第三部分:同步更新所有动画帧的配置 [f.name for f in fig.frames] ] ) ) # 把下拉菜单添加到图表布局中 fig.update_layout( updatemenus=[ dict( active=0, # 默认选中第一个按钮 buttons=buttons, direction="down", pad={"r": 10, "t": 10}, showactive=True, x=0.1, # 下拉菜单x轴位置 xanchor="left", y=1.15, # 下拉菜单y轴位置,放在地图上方避免遮挡 yanchor="top" ) ], # 配置颜色条标题 coloraxis_colorbar_title=switch_conf[0]["show_name"] ) fig.show() fig.write_html("example_map1.html")
修改说明
- 新增了可切换字段的统一配置项,方便你后续调整字段、色阶、数值范围
- 下拉菜单的每个按钮绑定了字段切换逻辑,点击后会同步更新当前地图的数值字段、色阶、数值范围,同时所有日期的动画帧内容也会同步切换
- 下拉菜单默认放在地图上方,你可以调整配置里的
x、y参数修改位置
内容的提问来源于stack exchange,提问作者dhuhahuss
相关产品推荐
相关产品推荐

