Plotly多柱状图合并为单X轴的代码优化咨询

需求描述 #

当前使用Plotly的make_subplots创建了3个子图形式的柱状图，希望将所有柱状图合并到同一个X轴上展示，而非分开展示。

原代码 #

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

occ_data_monday= {"Occupancy Monday":[min_o_monday,mean_o_monday,max_o_monday,mean10_4_o_monday],
           "Statistics":["Minimum","Average","Maximum","Maximum Average"]
}

occ_data_tuesday= {"Occupancy Tuesday":[min_o_tuesday,mean_o_tuesday,max_o_tuesday,mean10_4_o_tuesday],
           "Statistics":["Minimum","Average","Maximum","Maximum Average"]
}

trace1 = go.Bar(x=["Minimum","Average","Maximum","Maximum Average"],
                                    y=(occ_data_monday["Occupancy Monday"]), 
                                    text=(occ_data_monday["Statistics"]),
                                    textposition="outside",
                                    texttemplate="%{y:.0%}",
                                    marker_color=occ_colours,
                                    width=[0.1,0.1,0.1,0.1],
)

trace2 = go.Bar(x=occ_data_monday["Statistics"],
                                    y=(occ_data_tuesday["Occupancy Tuesday"]), 
                                    text=(occ_data_tuesday["Statistics"]),
                                    textposition="outside",
                                    texttemplate="%{y:.0%}",
                                    marker_color=occ_colours,
                                    width=[0.1,0.1,0.1,0.1],
)

trace3 = go.Bar(x=occ_data_monday["Statistics"],
                                    y=(occ_data_tuesday["Occupancy Tuesday"]), 
                                    text=(occ_data_tuesday["Statistics"]),
                                    textposition="outside",
                                    texttemplate="%{y:.0%}",
                                    marker_color=occ_colours,
                                    width=[0.1,0.1,0.1,0.1],
)


fig = tools.make_subplots(rows=3, cols=1, specs=[[{}], [{}], [{}]],
                          shared_xaxes=True, shared_yaxes=True,
                          vertical_spacing=0.001)


fig.append_trace(trace1, 3, 1)
fig.append_trace(trace2, 2, 1)
fig.append_trace(trace3, 1, 1)

fig['layout'].update(height=600, width=600, title='')
fig

优化方案 #

无需使用make_subplots，直接创建单个Figure并添加所有Bar trace，通过设置barmode让柱状图在同一X轴下分组显示。

优化后代码 #

import plotly.graph_objects as go

# 预定义颜色区分不同系列
occ_colours = ["#1f77b4", "#ff7f0e", "#2ca02c"]

# 示例数据（需替换为实际数据）
min_o_monday, mean_o_monday, max_o_monday, mean10_4_o_monday = 0.2, 0.5, 0.8, 0.6
min_o_tuesday, mean_o_tuesday, max_o_tuesday, mean10_4_o_tuesday = 0.3, 0.55, 0.85, 0.65
min_o_wednesday, mean_o_wednesday, max_o_wednesday, mean10_4_o_wednesday = 0.25, 0.48, 0.78, 0.58

# 数据定义
occ_data_monday= {"Occupancy Monday":[min_o_monday,mean_o_monday,max_o_monday,mean10_4_o_monday],
           "Statistics":["Minimum","Average","Maximum","Maximum Average"]
}

occ_data_tuesday= {"Occupancy Tuesday":[min_o_tuesday,mean_o_tuesday,max_o_tuesday,mean10_4_o_tuesday],
           "Statistics":["Minimum","Average","Maximum","Maximum Average"]
}

occ_data_wednesday= {"Occupancy Wednesday":[min_o_wednesday,mean_o_wednesday,max_o_wednesday,mean10_4_o_wednesday],
           "Statistics":["Minimum","Average","Maximum","Maximum Average"]
}

# 创建三个Bar trace，添加name属性用于图例区分
trace1 = go.Bar(
    x=occ_data_monday["Statistics"],
    y=occ_data_monday["Occupancy Monday"], 
    text=occ_data_monday["Statistics"],
    textposition="outside",
    texttemplate="%{y:.0%}",
    marker_color=occ_colours[0],
    width=0.25,
    name="周一 occupancy"
)

trace2 = go.Bar(
    x=occ_data_tuesday["Statistics"],
    y=occ_data_tuesday["Occupancy Tuesday"], 
    text=occ_data_tuesday["Statistics"],
    textposition="outside",
    texttemplate="%{y:.0%}",
    marker_color=occ_colours[1],
    width=0.25,
    name="周二 occupancy"
)

trace3 = go.Bar(
    x=occ_data_wednesday["Statistics"],
    y=occ_data_wednesday["Occupancy Wednesday"], 
    text=occ_data_wednesday["Statistics"],
    textposition="outside",
    texttemplate="%{y:.0%}",
    marker_color=occ_colours[2],
    width=0.25,
    name="周三 occupancy"
)

# 创建单个Figure并添加所有trace
fig = go.Figure(data=[trace1, trace2, trace3])

# 设置布局：分组显示柱状图，完善轴标签和标题
fig.update_layout(
    barmode='group',
    height=600, 
    width=800, 
    title="每日 Occupancy 统计对比",
    xaxis_title="统计类型",
    yaxis_title="Occupancy 占比"
)

fig.show()

关键修改说明 #

1. 移除子图依赖：删除make_subplots相关代码，改用go.Figure()直接管理多个Bar trace
2. 添加图例标识：给每个go.Bar添加name属性，方便区分不同日期的数据系列
3. 调整柱状图宽度：设置合适的width值，确保同一X标签下的多个柱状图能并排显示
4. 启用分组模式：通过barmode='group'让柱状图按X标签分组，避免重叠
5. 补全数据逻辑：原代码中trace2和trace3重复使用周二数据，优化后补充了周三数据示例，需根据实际情况替换

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