You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何在单个Mapbox地图中为两个Plotly图层设置不同颜色

解决Plotly Mapbox双图层颜色冲突问题

问题核心是两个图层默认共享同一个颜色轴(coloraxis),导致第二个图层的配色被第一个覆盖。需要为第二个图层指定独立的颜色轴,并分别配置两个颜色轴的样式。

修改后的代码

import plotly.express as px

# 绘制第一个 choropleth 图层
fig = px.choropleth_mapbox(geo_df,
                           geojson=geo_df.geometry,
                           locations=geo_df.index,
                           color="TOTAL_POPULATION", 
                           color_continuous_scale=px.colors.sequential.Greens,
                           center={"lat": 40.7, "lon": -73.95},
                           mapbox_style="open-street-map",
                           zoom=10)

# 绘制第二个 scatter 图层
fig2 = px.scatter_mapbox(geo_df, lat="INTPTLAT", lon="INTPTLON", 
                         size="MEDIAN_VALUE", color="MEDIAN_VALUE",
                         color_continuous_scale=px.colors.sequential.Blues,
                         mapbox_style="open-street-map")

# 为散点图层指定独立的颜色轴
scatter_trace = fig2.data[0]
scatter_trace.coloraxis = "coloraxis2"

# 添加散点图层到主图
fig.add_trace(scatter_trace)

# 配置布局:设置两个颜色轴的样式和位置
fig.update_layout(
    autosize=False,
    width=1400,
    height=1000,
    # 配置第一个颜色轴( choropleth 图层)
    coloraxis=dict(
        colorbar=dict(
            title="总人口",
            orientation="v",
            x=0.98  # 放在右侧
        )
    ),
    # 配置第二个颜色轴( scatter 图层)
    coloraxis2=dict(
        color_continuous_scale=px.colors.sequential.Blues,
        colorbar=dict(
            title="中位值",
            orientation="v",
            x=0.02  # 放在左侧
        ),
        # 可选:根据数据范围设置颜色轴范围,避免自动缩放偏差
        range=[geo_df["MEDIAN_VALUE"].min(), geo_df["MEDIAN_VALUE"].max()]
    )
)

fig.show()

关键修改说明

  • 为散点图层的trace设置coloraxis="coloraxis2",让它使用独立于第一个图层的颜色轴
  • 在update_layout中显式配置两个颜色轴:
    • 分别指定各自的颜色刻度(color_continuous_scale)
    • 设置颜色条的标题、位置,避免两个颜色条重叠
    • 可选:手动设置颜色轴范围,确保配色映射符合数据实际分布

内容的提问来源于stack exchange,提问作者Ankur

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.11 02:40:28