Plotly-Python：如何为标题文本设置背景颜色？

我希望为Plotly图表的标题（包括主标题和子图标题）设置背景颜色，以下是我的多子图Plotly代码示例，请问能否通过Plotly实现标题文本背景颜色的修改？

代码示例 #

from plotly.subplots import make_subplots
import plotly.graph_objects as go

fig = make_subplots(
    rows=2, cols=2,
    subplot_titles=("Plot 1", "Plot 2", "Plot 3", "Plot 4"))

fig.add_trace(go.Scatter(x=[1, 2, 3], y=[4, 5, 6]),
              row=1, col=1)

fig.add_trace(go.Scatter(x=[20, 30, 40], y=[50, 60, 70]),
              row=1, col=2)

fig.add_trace(go.Scatter(x=[300, 400, 500], y=[600, 700, 800]),
              row=2, col=1)

fig.add_trace(go.Scatter(x=[4000, 5000, 6000], y=[7000, 8000, 9000]),
              row=2, col=2)

fig.update_layout(height=500, width=700,
                  title_text="Multiple Subplots with Titles")

fig.show()

Plotly原生支持为标题添加背景颜色，需要分别对主标题和子图标题进行针对性配置：

1. 主标题背景色设置 #

通过update_layout中的title参数字典，直接指定bgcolor设置背景色，搭配pad调整内边距优化显示效果：

2. 子图标题背景色设置 #

子图标题本质是Plotly的注释元素，需要遍历layout.annotations，筛选出子图对应的注释项后添加背景色配置。

修改后的完整代码 #

from plotly.subplots import make_subplots
import plotly.graph_objects as go

fig = make_subplots(
    rows=2, cols=2,
    subplot_titles=("Plot 1", "Plot 2", "Plot 3", "Plot 4"))

fig.add_trace(go.Scatter(x=[1, 2, 3], y=[4, 5, 6]),
              row=1, col=1)

fig.add_trace(go.Scatter(x=[20, 30, 40], y=[50, 60, 70]),
              row=1, col=2)

fig.add_trace(go.Scatter(x=[300, 400, 500], y=[600, 700, 800]),
              row=2, col=1)

fig.add_trace(go.Scatter(x=[4000, 5000, 6000], y=[7000, 8000, 9000]),
              row=2, col=2)

# 配置主标题背景色
fig.update_layout(
    height=500,
    width=700,
    title={
        'text': "Multiple Subplots with Titles",
        'font': {'size': 16},
        'bgcolor': '#f0f8ff',  # 浅蓝色背景
        'pad': {'t': 20, 'b': 20, 'l': 20, 'r': 20}  # 内边距避免文本贴边框
    }
)

# 配置子图标题背景色
for anno in fig['layout']['annotations']:
    # 筛选子图标题注释（主标题注释y值接近1，子图标题y值在0-1区间内）
    if anno['xref'] == 'paper' and 0 < anno['y'] < 1:
        anno.update({
            'bgcolor': '#ffe4c4',  # 浅橙色背景
            'font': {'size': 14},
            'pad': {'t': 5, 'b': 5, 'l': 10, 'r': 10}
        })

fig.show()

关键说明 #

• 颜色值支持十六进制码、RGB值或标准颜色名称（如'lightblue'）
• pad参数用于调整背景框与文本的间距，提升视觉舒适度
• 子图标题的筛选逻辑可根据实际布局微调，确保只修改目标注释

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