Dash仪表盘使用go.Table创建带子列表格的问题求助

方案1：使用Plotly Go.Table实现层级表头 #

Go.Table支持通过多行表头和colspan属性实现合并单元格，直接构建你需要的结构，无需叠加多个Table对象：

import plotly.graph_objects as go

fig = go.Figure(data=[go.Table(
    header=dict(
        # 二维数组定义两行表头：第一行主列，第二行子列
        values=[
            ['<b>Column 1</b>', '<b>Column 2</b>'],
            ['Sub C.1', 'Sub C.2', 'Sub C.1', 'Sub C.2']
        ],
        # 主列各自跨越2个单元格，匹配下方子列数量
        colspan=[2, 2],
        fill_color='paleturquoise',
        align='left',
        font=dict(size=12, color='black')
    ),
    cells=dict(
        # 数据顺序与子列完全对应：列1子1 → 列1子2 → 列2子1 → 列2子2
        values=[
            [1, 2],
            [3, 4],
            [5, 6],
            [7, 8]
        ],
        fill_color='white',
        align='left'
    )
)])

fig.show()

关键说明：

• header.values用二维数组定义多行表头，第一行是主列标题，第二行是子列标题
• colspan=[2,2]指定第一行的两个主列分别覆盖2个单元格，刚好对应下方的两个子列
• 单元格数据的顺序必须与子列顺序严格对应，保证数据匹配正确

方案2：使用Dash DataTable实现（更适合Dash仪表盘） #

如果你是在Dash项目中开发，dash_table.DataTable对层级表头的支持更直观，无需手动计算colspan：

from dash import Dash, dash_table, html

app = Dash(__name__)

app.layout = html.Div([
    dash_table.DataTable(
        columns=[
            # 用二维数组定义层级表头：[主列名, 子列名]
            {'name': ['Column 1', 'Sub C.1'], 'id': 'col1_sub1'},
            {'name': ['Column 1', 'Sub C.2'], 'id': 'col1_sub2'},
            {'name': ['Column 2', 'Sub C.1'], 'id': 'col2_sub1'},
            {'name': ['Column 2', 'Sub C.2'], 'id': 'col2_sub2'},
        ],
        data=[
            {'col1_sub1': 1, 'col1_sub2': 3, 'col2_sub1':5, 'col2_sub2':7},
            {'col1_sub1':2, 'col1_sub2':4, 'col2_sub1':6, 'col2_sub2':8}
        ],
        # 自动合并重复的主列表头
        merge_duplicate_headers=True,
        style_header={
            'backgroundColor': 'paleturquoise',
            'textAlign': 'left'
        },
        style_cell={
            'textAlign': 'left'
        }
    )
])

if __name__ == '__main__':
    app.run_server(debug=True)

优势：

• 原生支持层级表头，通过name参数的二维数组直接定义
• merge_duplicate_headers=True自动合并相同主列，无需手动配置跨度
• 内置排序、过滤、编辑等交互功能，更适合Dash仪表盘场景

你之前代码的问题分析 #

你创建了两个独立的go.Table对象并叠加，这会导致两个表格并排或重叠，而非合并成一个带层级表头的表格。Go.Table本身支持多行表头和单元格合并，无需拆分多个Table对象。

内容的提问来源于stack exchange，提问作者João P.