文章/答案/技术大牛

发布

社区首页 >问答首页 >如何使用pyscript保存图形

问如何使用pyscript保存图形
EN

Stack Overflow用户

提问于 2022-06-01 14:05:16

回答 1查看 264关注 0票数 0

正如标题所提到的，实际上我是html和css的新手。那么我如何使用savefig或其他方法来使用matplotlib保存绘图文件呢？

<html>
  <body style="margin: 25px 75px 25px 75px;">
    <div class="p-5 text-center bg-light">
      <p>Quick Draw by<a href="https://github.com/ELongking"> <span>Longking</span> </a></p>
      <p><a href="https://github.com/pyscript/pyscript"><span>PyScript</span></a> is a very new framework, it needs a few seconds to load...</p>
      <h3>If you want to use it again, you need to refresh the page</h3>
    </div>
    
    <div class="container" id="test-plot">
    <p>Please enter your equation which is need to be drawn</p>
    <input id="eq" type="text" width="20" placeholder="y=2*x+sqrt(x)">
    <br>
    <p>Set the range of x coordinate</p>
    <input id="ra" type="text" width="20" placeholder="-5,5">
    <br>

    <p>Save or not</p>
    <input id="save" type="text" width="20" placeholder="yes or no">
    <br>

    <button id="but" style="margin-top: 10px;margin-bottom: 10px;" type="button" pys-onClick="main">
  Generate</button>
    </div>
    <py-script>

      from numpy import *
      from matplotlib import pyplot as plt, style as sty
      from js import console, document
      
      def main(*args,**kwargs):

        eq=document.getElementById("eq").value
        ra=document.getElementById("ra").value
        save=document.getElementById("save").value

        main_eq=eq.split('=')[1]
        if ra.find(',')>0:
          xmin,xmax=float(ra.split(',')[0]),float(ra.split(',')[1])
        else:
          xmin,xmax=-5,5

        x=linspace(xmin,xmax,1000)
        y=eval(main_eq)
        
        sty.use('seaborn-paper')
        fig, ax = plt.subplots()
        ax.plot(x, y,'--')

        if save=="yes":
          plt.savefig(r"D:\result.png",dpi=600)
        pyscript.write("test-plot",fig)

    </py-script>
    </div>
  </body>
</html>

我想把数字保存到D驱动器的result.png上，但是它对我没有用。谢谢你的解决方案。

html

matplotlib

pyscript

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-06-01 20:21:59

以下代码行写入浏览器的虚拟文件系统，而不是写入用户的桌面文件系统：

plt.savefig(r"D:\result.png",dpi=600)

解决方案是使用浏览器文件系统API向用户的桌面文件系统写入。

首先，将数据保存为BytesIO，然后调用函数来执行文件保存：

buf = io.BytesIO()
plt.savefig(buf, format='png')
await save_file(buf)

文件保存功能将与浏览器的文件系统接口：

import asyncio
from js import console, document, window, Blob
from pyodide import to_js

async def save_file(buf):
        try:
                # Read and convert to a JavaScript array
                buf.seek(0)
                content = to_js(buf.read())

                # Create a JavaScript Blob and set the Blob type as a PNG
                b = Blob.new([content], {type: "image/png"})

                # Perform the actual file system save 
                fileHandle = await window.showSaveFilePicker()
                file = await fileHandle.createWritable()
                await file.write(b)
                await file.close()
        except Exception as e:
                console.log('Exception: ' + str(e))
                return

我写了一篇文章，帮助解释与浏览器的文件系统的接口：

文件和文件系统.第2部分

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/72463208

复制

相似问题

问如何使用pyscript保存图形
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用pyscript保存图形EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问如何使用pyscript保存图形
EN