線を描く

絵を描けるようにするには、canvas要素を追加します。
canvas要素内で以下のメソッドで描画します。

描画メソッド	内容
beginPath	パスの開始
moveTo	X, Yに移動
lineTo	X, Yに向けて線を描画
closePath	パスを閉じて描画（最後に始点に向かってパスが引かれます）
stroke	パスを線として表示

---

---

---

<canvas id="drawPathCanvas" onmouseover="drawPath();" style="border: 1px solid;" width="400" height="300">
</canvas>
<script language="javascript" type="text/javascript">
function drawPath() {
    var c = document.getElementById("drawPathCanvas");
    var context = c.getContext("2d");
    context.beginPath();
    context.moveTo(100, 100);
    context.lineTo(300, 200);
    context.stroke();
}
</script>

---