如何將 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中文網其他相關文章！