Canvas 教程
本教程將從基礎開始，介紹如何使用 <canvas> 元素繪製 2D 圖形。提供的示例將幫助您清楚地瞭解可以使用 Canvas 做些什麼，並提供可用於開始構建自己內容的 程式碼片段。
<canvas> 是一個 HTML 元素，可用於透過指令碼（通常是 JavaScript）繪製圖形。例如，這可以用於繪製圖表、合併照片或建立簡單的動畫。
<canvas> 最初由 Apple 在 WebKit 中為 macOS Dashboard 引入，此後已在瀏覽器中實現。如今，所有主流瀏覽器都支援它。
開始之前
使用 <canvas> 元素並不難，但您需要對 HTML 和 JavaScript 有基本瞭解。<canvas> 元素在某些舊版瀏覽器中不受支援，但在所有主流瀏覽器的最新版本中都受支援。Canvas 的預設大小為 300 畫素 × 150 畫素（寬 × 高）。但是，可以使用 HTML 的 height 和 width 屬性定義自定義大小。為了在 Canvas 上繪製圖形，我們使用 JavaScript 上下文物件，該物件會動態建立圖形。