如何将 HTML Canvas 保存为 PNG 图像？

捕获 HTML Canvas 输出为各种图像格式

问题：

HTML Canvas 的内容是否可以捕获或打印为图片还是 PDF？具体来说，如何从画布生成图像并保存为 PNG？

答案：

使用 HTML5 的高级功能，捕获画布输出并将其保存为图像已成为一个简单的过程：

const canvas = document.getElementById('mycanvas');
const img = canvas.toDataURL('image/png');

一旦所需的图像数据存储在 img 变量中，就可以使用它各种方式：

• 生成新图像：

document.getElementById('existing-image-id').src = img;

• 直接以 HTML 形式显示：

document.write('<img src="' + img + '" />');

此脚本使您能够捕获和将画布输出保存为 PNG 图像，为进一步使用或分发提供方便的方法。

以上是如何将 HTML Canvas 保存为 PNG 图像？的详细内容。更多信息请关注PHP中文网其他相关文章！