如何用Altair及Streamlit基于表格制作分组条形图？

方法1：原生Streamlit bar_chart快速实现 #

原生st.bar_chart支持直接传入宽格式数据，指定x轴为分类列即可快速生成分组条形图：

import pandas as pd
import streamlit as st

# 初始化数据并转换数值类型（字符串转整数）
df = pd.DataFrame(
    [['sst', '100', '1000'], ['can', '500', '600']],
    columns=['model', '0', '1']
)
df[['0', '1']] = df[['0', '1']].astype(int)

# 生成分组条形图，指定x轴和分组数值列
st.bar_chart(
    df,
    x='model',
    y=['0', '1'],  # 把要展示的数值列设为分组维度
    use_container_width=True,
    y_label='数值',
    x_label='模型'
)

说明：这种方法无需额外依赖，适合快速生成基础分组条形图，但样式自定义空间有限。

方法2：Altair自定义分组条形图（推荐） #

如果需要更灵活的样式控制（比如自定义颜色、交互效果、分组间距等），推荐使用Altair库，步骤如下：

1. 转换数据格式 #

将宽格式数据转换为长格式（melt），这是可视化库处理多分组数据的标准格式：

# 转成长格式：保留model作为分类列，将原数值列转为分组名称和对应数值
df_long = df.melt(
    id_vars='model',
    var_name='category',
    value_name='value'
)

转换后的数据结构示例：

2. 用Altair绘制分组条形图 #

通过xOffset实现同一分类下的分组条并排，同时自定义样式和交互：

import altair as alt

# 构建分组条形图
chart = alt.Chart(df_long).mark_bar(size=80).encode(
    x=alt.X('model:N', title='模型'),
    y=alt.Y('value:Q', title='数值'),
    color=alt.Color('category:N', title='类别', scale=alt.Scale(scheme='set1')),
    xOffset='category:N',  # 实现同模型下的分组条并排
    tooltip=['model', 'category', 'value']  # 鼠标悬浮显示详情
).properties(
    width=600,
    height=400,
    title='模型分组数值对比'
).configure_title(
    fontSize=16,
    anchor='middle'
)

# 在Streamlit中展示图表
st.altair_chart(chart, use_container_width=True)

常用自定义选项：

• 修改size参数调整条形宽度
• 通过scale指定自定义颜色方案
• 添加tooltip提升交互体验
• 调整width/height控制图表尺寸

关键注意事项 #

• 必须确保数值列是数值类型（而非字符串），否则无法正确渲染条形图
• 长格式数据更适配可视化工具的分组逻辑，避免宽格式带来的维度混乱
• Altair提供比原生Streamlit图表更强的自定义能力，适合复杂可视化需求

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