<canvas?id="canvas">

</canvas>


<script>
???var?canvas?=??document.getElementById('canvas');
???var?context?=?canvas.getContext('2d');
???context.moveTo(100,100)//直線的起點

???context.lineTo(700,700)//直線的終點

???context.lineTo(100,700)//多筆畫時設置多終點即可

???context.lineTo(100,100)//最后的筆畫終點和開始的起點同坐標能連成一個完整形狀（每一筆都是以上一個終點為起點的）
???context.stroke();
</script>