江苏龙网

  1. 首页 > 生活 > >

matplotlib画图展示在页面上

目前为止，我获得的最接近的体验是使用mpld3包，相当于一个matplotlib的后端。基本上不需要改啥代码，只用改改import就好。当然，你也可以考虑放弃matplotlib改用bokeh或者plotly……上面几个其实都是以json载入绘图数据然后用js画的。如果你懂一点js和前端知识，一切都很简单。除此之外，你还可以考虑直接在jupyter notebook的基础上改个扩展。不过这就太重型了。
■网友
尝试了下：
import cStringIOfrom bottle import run, get, HTTPResponsefrom matplotlib.figure import Figurefrom matplotlib.backends.backend_agg import FigureCanvasAggfig = Figure(figsize=)ax = fig.add_axes()ax.scatter(, )canvas = FigureCanvasAgg(fig)buf = cStringIO.StringIO()canvas.print_png(buf)data = https://www.zhihu.com/api/v4/questions/48947385/buf.getvalue()headers = { /u0026#39;Content-Type/u0026#39;: /u0026#39;image/png/u0026#39;, /u0026#39;Content-Length/u0026#39;: len(data)}@get(/u0026#39;/u0026#39;)def hello(): return HTTPResponse(body=data, headers=headers,)run(port=8080)
运行后访问本地8080端口：
matplotlib画图展示在页面上



■网友
将图像以 Base64 格式发送给前端该方法也是本人最终采取的方法。原理是在调用 savefig 方法时不存储为图像，而是存储为二进制格式，二进制格式再转化为 Base64 格式，并将其发送给前端，前端只需要将 \u0026lt;img\\\u0026gt; 标签的 src 属性赋值为后端发送的 Base64 字符串即可。
后端代码如下所示
from io import BytesIOimport base64import matplotlib.pyplot as pltfig = plt.figure(figsize=(1, 1))...sio = BytesIO()fig.savefig(sio, format=\u0026#39;png\u0026#39;, bbox_inches=\u0026#39;tight\u0026#39;, pad_inches=0.0)data = base64.encodebytes(sio.getvalue()).decode()src = \u0026#39;data:image/png;base64,\u0026#39; + str(data)将最后一行的 src 传到前端即可展示。
该方法优点如下
该方法可以在后端生成完图像后再发送给前端，无需设置延时获取图像；该方法只需要往前端发送一次请求，代码更加精简；调用了 savefig 方法，可以去除白边。各种方法的对比参见本人博客
如何将 Matplotlib 图像展示在 web 页面上

■网友
我也尝试过几种 一个是 mpld3
html = mpld3.fig_to_html(fig)plt.close()return html
matplotlib画图展示在页面上

matplotlib画图展示在页面上

savefig存成图片
matplotlib画图展示在页面上

matplotlib画图展示在页面上

或者和简书上那篇差不多
将图像转为 base64 代码即可将图像嵌入 HTML 代码字符串中。python 的 base64 模块可以实现将二进制文件转为 base64 编码，而 matplotlib 的pyplot.savefig()函数可以将绘图窗口保存为二进制文件格式。
sio = BytesIO()
plt.savefig(sio, format=\u0026#39;png\u0026#39;)


推荐阅读


上一篇：PPT中，动画和素材效果太多，导致编辑起来非常不方便，怎样简化这些动作或者可以暂时隐藏

下一篇：实习时间与校招时间冲突咋办