如何去除Plotly Scatter3d图表在浏览器渲染时的白色边框？

方法1：关闭3D场景默认边框 #

Scatter3d的3D场景自带默认边框，这大概率是你看到的白框。可以在layout的scene配置里关闭边框，同时设置场景背景色匹配你的深色页面：

import plotly.graph_objects as go

fig = go.Figure(data=[go.Scatter3d(x=[1,2,3], y=[4,5,6], z=[7,8,9], mode='markers')])

fig.update_layout(
    # 设置页面整体背景色匹配深色风格
    paper_bgcolor="#1a1a1a",
    # 设置图表区域背景色
    plot_bgcolor="#1a1a1a",
    # 配置3D场景
    scene=dict(
        # 关闭三个坐标轴的网格、线条和显示状态
        xaxis=dict(showgrid=False, showline=False, visible=False),
        yaxis=dict(showgrid=False, showline=False, visible=False),
        zaxis=dict(showgrid=False, showline=False, visible=False),
        # 设置3D场景背景色
        bgcolor="#1a1a1a"
    ),
    # 确保四边边距完全清零
    margin=dict(l=0, r=0, t=0, b=0)
)

fig.show()

方法2：调整Plotly渲染配置 #

如果白框来自Plotly生成的交互栏或容器高亮，可以通过config参数关闭相关默认样式：

fig.show(config=dict(
    # 关闭顶部的交互模式栏
    displayModeBar=False,
    # 关闭双击图表时的边框高亮效果
    doubleClick=False
))

若你是将图表嵌入自定义HTML页面，可直接给Plotly容器div添加样式：

<div id="plot-container" style="border: none; background-color: #1a1a1a;"></div>

方法3：覆盖浏览器默认样式 #

少数情况下浏览器会给Plotly的canvas或div元素加默认边框，可通过自定义CSS强制覆盖：

.plotly-graph-div {
    border: 0 !important;
    background-color: #1a1a1a !important;
}

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