這篇文章主要介紹了html5中怎么使用canvas畫(huà)一條線的相關(guān)知識(shí)，內(nèi)容詳細(xì)易懂，操作簡(jiǎn)單快捷，具有一定借鑒價(jià)值，相信大家閱讀完這篇html5中怎么使用canvas畫(huà)一條線文章都會(huì)有所收獲，下面我們一起來(lái)看看吧。

創(chuàng)新互聯(lián)從2013年成立，先為旬陽(yáng)等服務(wù)建站，旬陽(yáng)等地企業(yè)，進(jìn)行企業(yè)商務(wù)咨詢(xún)服務(wù)。為旬陽(yáng)企業(yè)網(wǎng)站制作PC+手機(jī)+微官網(wǎng)三網(wǎng)同步一站式服務(wù)解決您的所有建站問(wèn)題。

代碼如下:

var canvas=document.getElementById("canvas");

//設(shè)置繪圖環(huán)境

var cxt=canvas.getContext('2d');

//開(kāi)啟新路近

cxt.beginPath();

// 設(shè)置筆觸的寬度

cxt.lineWidth=10;

//設(shè)置筆觸的顏色

cxt.strokeStyle="#00ff00";

//設(shè)定筆觸的位置

cxt.moveTo(20,20);

//設(shè)置移動(dòng)的位置

cxt.lineTo(100,20);

//畫(huà)線

cxt.stroke();//這個(gè)時(shí)候的線已經(jīng)出來(lái)了

//關(guān)閉路徑

cxt.closePath();

//凡事路徑圖形必須先開(kāi)始路徑,畫(huà)完之后必須結(jié)束路徑

關(guān)于“html5中怎么使用canvas畫(huà)一條線”這篇文章的內(nèi)容就介紹到這里，感謝各位的閱讀！相信大家對(duì)“html5中怎么使用canvas畫(huà)一條線”知識(shí)都有一定的了解，大家如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道。