Colab中Ipywidgets.Output包裹Plotly表格子图首列不显示求助

问题现象 #

• 在Colab中将Plotly表格作为子图放入Ipywidgets.Output组件内时，表格首列内容无法显示
• 点击Plotly工具栏的「重置」按钮后，首列内容恢复正常显示
• 单独生成表格无异常，仅被Output包裹时出现该问题；下载为PNG格式时表格显示正常
• 已尝试更换浏览器、设置单元格高度为35，均未解决问题

核心原因分析 #

1. 变量名冲突：原代码中同时用output作为Colab自定义组件管理器的导入名和Ipywidgets.Output实例的变量名，导致对象被覆盖，引发渲染异常
2. 布局计算时机问题：Output组件包裹时，Plotly图表的初始布局计算未正确触发，导致首列宽度被设为0，重置操作会强制重新计算布局

解决方案 #

1. 修正变量名冲突：避免用相同名称命名不同对象，将Ipywidgets.Output实例的变量名改为output_widget或其他不冲突的名称
2. 强制触发布局更新：在调用fig.show()前手动设置布局参数，确保图表容器和表格列宽正确计算

修改后的完整代码 #

import plotly.graph_objects as go
from plotly.subplots import make_subplots
import ipywidgets as widgets
from google.colab import output as colab_output

# 启用Colab自定义组件管理器
colab_output.enable_custom_widget_manager()

# 初始化1行2列的子图
fig = make_subplots(rows=1, cols=2)

report_data = [[' Total Distance', '29,873,735,731'], [' Average Distance', '382.9']]
# 修正变量名，避免与colab的output冲突
output_widget = widgets.Output()

with output_widget:
    # 添加第一个表格子图
    fig.add_trace(
        go.Table(
            header=dict(values=['Summary', ' '], align='left'),
            cells=dict(values=list(zip(*report_data)), align='left')
        ),
        row=1, col=1
    )
    # 添加第二个表格子图
    fig.add_trace(
        go.Table(
            header=dict(values=['Summary', ' '], align='left'),
            cells=dict(values=list(zip(*report_data)), align='left')
        ),
        row=1, col=2
    )
    # 强制设置布局参数，确保初始渲染时列宽正确计算
    fig.update_layout(
        autosize=True,
        margin=dict(l=20, r=20, t=20, b=20),
        height=200  # 手动设置图表高度，辅助布局计算
    )
    # 渲染图表
    fig.show(renderer="colab")

# 显示Output组件
display(output_widget)

额外验证方案 #

如果上述方法仍未解决，可尝试：

• 将renderer="colab"替换为renderer="notebook"，使用Plotly的原生笔记本渲染器
• 在display(output_widget)前添加短暂延迟，例如使用time.sleep(0.5)，给图表足够的渲染计算时间

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