如何在Plotly Express中添加符号含义二级图例并支持分组选择？

核心思路 #

放弃原有的按state单独分配trace的方式，改为按符号类型分组创建trace，让图例直接对应符号的含义，点击图例项就能一键显示/隐藏整个符号组的所有州。

具体步骤&代码示例 #

1. 预处理数据
   给你的DataFrame新增一列，比如symbol_desc，把每个符号对应的含义（比如"覆盖较差"）映射进去，方便后续图例显示。

2. 按符号分组生成图表
   用px.scatter_geo（或对应类型的Plotly函数），指定color为symbol_desc，symbol为你的符号列，这样每个符号类型会成为一个独立的trace组，图例自动对应符号含义。

import plotly.express as px
import pandas as pd

# 替换成你的实际数据
df = pd.DataFrame({
    "state": ["CA", "NY", "TX", "FL", "IL"],
    "lat": [36.7783, 40.7128, 31.9686, 27.6648, 40.6331],
    "lon": [-119.4179, -74.0060, -99.9018, -81.5158, -89.3985],
    "symbol": ["triangle-down", "circle", "triangle-down", "square", "circle"],
    "symbol_desc": ["覆盖较差", "覆盖良好", "覆盖较差", "覆盖一般", "覆盖良好"]
})

# 生成地理散点图，按符号含义分组
fig = px.scatter_geo(
    df,
    lat="lat",
    lon="lon",
    color="symbol_desc",  # 按符号含义分组
    symbol="symbol",      # 绑定符号
    # 手动映射符号（如果需要统一符号和含义的对应关系）
    symbol_map={"覆盖较差": "triangle-down", "覆盖良好": "circle", "覆盖一般": "square"},
    hover_name="state",   # hover时显示州名
    title="美国各州覆盖情况"
)

# 优化图例样式，让分组更清晰
fig.update_layout(
    legend=dict(
        title="覆盖等级",
        tracegroupgap=10,  # 分组之间的间距
        itemsizing="constant"  # 保持图例符号大小一致
    )
)

fig.show()

备选方案：静态脚注式符号说明 #

如果暂时不需要可点击的分组图例，也可以直接在图表底部添加静态的符号说明，解决之前HTML脚注失败的问题：

# 在图表底部添加符号说明脚注
fig.add_annotation(
    text="符号说明：<br>▼ 覆盖较差 ● 覆盖良好 ■ 覆盖一般",
    xref="paper", yref="paper",  # 基于画布坐标定位
    x=0.5, y=-0.15,  # 水平居中，垂直在画布下方
    showarrow=False,
    align="center",
    font=dict(size=10)
)

fig.show()

进阶：同时支持州和符号分组选择 #

如果需要同时保留按单个州点击选择、按符号分组点击选择的功能，需要结合Plotly的JavaScript回调（比如用Dash框架），通过restyle方法手动控制trace的显隐。但这种方式复杂度较高，优先推荐前面的符号分组方案。

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