将画布元素作为png下载的最简单方法是什么？

-1

<canvas id="canv" width="500" height="500"> </canvas> 
    <input type="submit" value="Download Canvas" onclick="download();"/> 


    function download() { 
    var canvas = document.getElementById("canv"); 
    var dataURL = toDataURL(canvas); 

    //Download code here: 

    }

什么是所需的代码，以启动下载的形象？

来源

2014-04-19 Anon Omus

'型= submit'通常意味着上传到服务器 - 而不是下载...是你想上传到服务器或客户端，让保存到他们的本地驱动器？ – markE

下载到他们的本地驱动器。 –

您可以使用FileSaver.js。有关更多信息，请参阅http://stackoverflow.com/a/36987094/2183503 – kotpal

最符合浏览器的方式是创建画布的客户端图像并将其显示在新的浏览器选项卡中。

然后用户可以“右键单击 - 保存为”图像，并指定他们想要下载图像的本地驱动器上的位置。

var html="<p>Right-click on image below and Save-Picture-As</p>"; 

html+="<img src='"+canvas.toDataURL()+"' alt='from canvas'/>"; 

var tab=window.open(); 

tab.document.write(html);

有一个新的saveAs方法，w3c引入了一个将blob数据保存到本地驱动器的saveAs方法。

但是它并没有在浏览器中普遍实现。

礼格雷已编码的效果很好垫片：https://github.com/eligrey/FileSaver.js/

来源

2014-04-20 15:46:53 markE

将画布元素作为png下载的最简单方法是什么？

回答

相关问题