HTML Canvas是一個非常有用的技術，可以用來繪制各種圖像和動畫。在這里我們將了解如何使用HTML Canvas API編寫一些基本的繪圖代碼。

//創建Canvas元素
var canvas = document.createElement('canvas');
canvas.width = 500;
canvas.height = 500;
document.body.appendChild(canvas);
//獲取Canvas上下文
var ctx = canvas.getContext('2d');
//在Canvas上畫一個矩形
ctx.fillStyle = '#0099FF';
ctx.fillRect(50, 50, 200, 100);
//在Canvas上繪制一條直線
ctx.beginPath();
ctx.moveTo(50, 50);
ctx.lineTo(250, 150);
ctx.lineWidth = 5;
ctx.strokeStyle = '#FF0000';
ctx.stroke();
//在Canvas上繪制一條曲線
ctx.beginPath();
ctx.moveTo(250, 150);
ctx.quadraticCurveTo(300, 100, 350, 150);
ctx.strokeStyle = '#FFFF00';
ctx.stroke();
//在Canvas上繪制一個圓形
ctx.beginPath();
ctx.arc(250, 250, 100, 0, 2 * Math.PI);
ctx.fillStyle = '#00FF00';
ctx.fill();
//在Canvas上繪制一個文本
ctx.font = 'bold 24px Arial';
ctx.fillStyle = '#FFFFFF';
ctx.fillText('Hello World', 200, 400);

以上代碼展示了一些基本的HTML Canvas繪圖代碼。我們創建了一個Canvas元素，獲取了其上下文對象，并在其上繪制了一個矩形、一條直線、一條曲線、一個圓形和一段文本。