# canvas snapshot

{% tabs %}
{% tab title="💈範例" %}
```javascript
// create <img> element
let img = document.createElement("img");

// save canvas content as PNG (encoded as string using "data:URL")
img.src = canvas.toDataURL();

// append to DOM
document.body.appendChild(img); //documentja
```
{% endtab %}

{% tab title="📗 參考" %}
* [ ] JavaScript: The Definitive Guide (15.8 Graphics in a \<canvas>)
{% endtab %}

{% tab title="📘 手冊" %}
* [HTMLCanvasElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement) ⟩ [.toDataURL()](https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toDataURL)
{% endtab %}
{% endtabs %}
