如何在Plotly Dash中为Plotly生成的表格添加滚动条？

当然可以实现！针对你的需求——既要在Dash里给Plotly表格加滚动条，又要保留表格对象用于PDF导出——这里有两个实用方案，都不会破坏你原有的go.Table复用逻辑：

方案1：给Graph容器添加滚动样式 #

这个方法最简单直接，通过给承载表格的dcc.Graph组件设置固定高度和溢出样式，当表格内容超过设定高度时自动触发垂直滚动。完全保留你原有的go.Table对象，不影响后续PDF导出。

修改后的完整代码： #

# 生成表格图形
import plotly.graph_objects as go
# 模拟更多行数据触发滚动效果
fig = go.Figure(data=[go.Table(
    header=dict(values=['A Scores', 'B Scores']),
    cells=dict(values=[[100, 90, 80, 90, 85, 70, 65, 95, 88, 77], 
                       [95, 85, 75, 95, 80, 75, 60, 90, 82, 72]])
)])

# 在Dash中展示
import dash
import dash_core_components as dcc
import dash_html_components as html
app = dash.Dash()
app.layout = html.Div([
    dcc.Graph(
        figure=fig,
        # 设置固定高度，超出部分自动滚动
        style={'height': '300px', 'overflowY': 'auto'}
    )
])
app.run_server(debug=True, use_reloader=False)

方案2：固定表头+内容滚动 #

如果希望表头固定在顶部，只有表格内容区域滚动（体验更友好），可以给go.Table配置fixed_header=True，同时设置表头和单元格的高度，再配合dcc.Graph的固定高度。同样不破坏原表格结构，PDF导出依然正常。

修改后的完整代码： #

# 生成表格图形
import plotly.graph_objects as go
fig = go.Figure(data=[go.Table(
    header=dict(
        values=['A Scores', 'B Scores'],
        fill_color='lightgrey',
        align='left',
        height=30  # 自定义表头高度
    ),
    cells=dict(
        values=[[100, 90, 80, 90, 85, 70, 65, 95, 88, 77], 
                [95, 85, 75, 95, 80, 75, 60, 90, 82, 72]],
        fill_color='white',
        align='left',
        height=25,  # 自定义单元格高度
        wrap=True  # 内容过长时自动换行
    ),
    fixed_header=True  # 开启固定表头功能
)])

# 在Dash中展示
import dash
import dash_core_components as dcc
import dash_html_components as html
app = dash.Dash()
app.layout = html.Div([
    dcc.Graph(
        figure=fig,
        style={'height': '250px'}  # 设置容器高度触发滚动
    )
])
app.run_server(debug=True, use_reloader=False)

关键说明： #

• 两种方案都保留了原始的go.Table对象，所以你依然可以用joblib复用这个对象来生成PDF，导出的PDF会显示完整的表格内容，不会因为Dash里的滚动设置而截断。
• 你可以根据实际需求调整height参数的数值，找到最适合的滚动触发阈值。

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