plotly的fig.write_html()可一步生成带缩放、悬停、图例开关的交互式html报告;需设include_plotlyjs="cdn"或"directory"确保离线可用,中文乱码需指定locale或字体。

直接用 plotly 生成带交互图表的 HTML 报告
不用手动拼 HTML、不依赖 Flask,plotly 的 write_html() 就能一步到位输出可缩放、悬停显示数值、支持图例开关的交互式报告。它底层用的是 JavaScript(Plotly.js),Python 只负责数据和配置。
常见错误现象:matplotlib 保存的 .png 嵌入 HTML 后是静态图,点不了、缩不了、看不到原始数据值;而 plotly.express 或 go.Figure 生成的对象调用 write_html() 后,浏览器打开就是完整交互页面。
- 必须用
fig.write_html("report.html"),不是plt.savefig()+ 手动写<img> - 中文标签默认可能乱码,需显式设置
locale="zh-CN"(部分版本)或通过layout.font.family指定字体 - 如果报告要离线使用,务必加参数
include_plotlyjs="cdn"(在线加载)或"directory"(打包本地 JS),否则双击打开白屏
plotly 和 matplotlib 混用时的关键取舍
已有 matplotlib 脚本?别硬改。可以保留绘图逻辑,但把最终输出环节换成 plotly —— 用 plotly.graph_objects 重写关键图,或用 plotly.tools.mpl_to_plotly()(注意:该函数在新版中已弃用,仅适用于旧版 plotly)。
更稳妥的做法是:对需要交互的部分(如趋势对比、多维度筛选)用 plotly.express.line() 或 px.scatter_matrix() 单独绘制;对纯示意性小图(如 logo、流程图)仍用 matplotlib 保存为 .svg 嵌入 HTML。
-
px.line(df, x="date", y=["sales", "cost"])自动带图例开关和时间范围滑块 -
px.histogram(df, x="score", marginal="box")同时展示分布+箱线图,悬停看频次 - 性能影响:含上千点的散点图,
plotly渲染比matplotlibPNG 快,但首次加载 JS 资源略慢(CDN 方式约 300–500ms)
嵌入自定义 JavaScript 实现简单交互(比如切换数据表)
HTML 报告不只是图表——常需点击按钮展开/收起原始数据表格、切换指标维度。这时不能只靠 plotly,得手写少量 JS 并注入 HTML。
做法是:先用 plotly 生成基础 HTML,再用 Python 读取该文件,找到
Python免费学习笔记(深入):立即使用
在学习笔记中,你将探索 Python 的核心概念和高级技巧!











