如何在Confluence页面中嵌入Plotly交互式图表？

你直接复制fig.write_html()生成的完整HTML到Confluence HTML宏里失效，核心原因是完整HTML的<html>``<head>等标签会和Confluence页面结构冲突，且Confluence会限制部分外部资源与脚本的执行。以下是两种可行的解决方法：

方案一：嵌入Plotly图表核心代码（依赖CDN） #

1. 修改Python代码，生成仅包含图表渲染所需的div和脚本片段：

   import plotly.express as px
   from plotly.offline import plot
   
   x = [1,1,2,3,3,3,4,5]
   fig = px.histogram(x=x)
   # 生成不含完整HTML结构的图表片段，通过CDN加载Plotly脚本
   plot_snippet = plot(fig, output_type='div', include_plotlyjs='cdn')
   print(plot_snippet)
   

2. 将打印出的内容直接粘贴到Confluence的HTML宏中：
   这段内容仅包含带唯一ID的<div>标签和调用CDN脚本的代码，不会与Confluence页面结构冲突，且合规加载外部渲染资源。

方案二：导出为静态图片嵌入（兼容性最强） #

如果你的Confluence环境限制脚本执行，可直接将图表导出为静态图片：

import plotly.express as px

x = [1,1,2,3,3,3,4,5]
fig = px.histogram(x=x)
# 导出为PNG格式（也支持JPG/SVG）
fig.write_image('my_plot.png')

之后在Confluence页面中直接上传并插入该图片即可，无需依赖任何脚本执行。

额外注意 #

• 若团队限制外部CDN资源，可将Plotly JS文件上传至Confluence附件，修改脚本引用为内部路径后再使用方案一。
• 部分HTML宏插件会过滤脚本标签，可先测试简单Plotly片段确认插件支持脚本执行。

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