html5使用canvas畫一條線_html5教學技巧

程式碼太簡單了，就不廢話了

複製程式碼

程式碼如下:

var canvas=document. ");
//設定繪圖環境
var cxt=canvas.getContext('2d');
//開啟新路近
cxt.beginPath();
// 設定筆觸的寬度
cxt.lineWidth=10;
//設定筆觸的顏色
cxt.strokeStyle="#00ff00";
//設定筆觸的位置
cxt.moveTo( 20,20);
//設定移動的位置
cxt.lineTo(100,20);
//畫線
cxt.stroke();//這個時候的線已經出來了
//關掉路徑
cxt.closePath();
//凡事路徑圖形必須先開始路徑,畫完之後必須結束路徑