canvasを画像として保存するコンソールコマンド

自分でcanvasを生成する場合

code:javascript

const canvas = document.createElement("canvas")

// canvasに対する適当な処理

const a = document.createElement("a")

a.href = canvas.toDataURL()

a.download = "<ダウンロード時のファイル名>.png"

a.click()

既存のcanvas要素を用いる場合

code:js

function canvas2image(canvas, filename = "canvas.png") {

const a = document.createElement("a")

a.href = canvas.toDataURL()

a.download = filename

a.click()

}

呼び出し例

code:js

const canvas = document.querySelector("canvas#foo")

canvas2image(canvas, "foo.png")