HTML示例:
<canvas id="canvas" style="width:400;height:300"></canvas>
JS示例:
var context=document.getElementById("canvas").getContext("2d");
context.beginPath();
// 設(shè)置線寬
context.lineWidth = 4;
// 設(shè)置間距(參數(shù)為無限數(shù)組佑钾,虛線的樣式會隨數(shù)組循環(huán))
context.setLineDash([8, 8]);
// 移動畫筆至坐標(biāo) x20 y20 的位置
context.moveTo(20, 20);
// 繪制到坐標(biāo) x20 y100 的位置
context.lineTo(20, 100);
// 繪制到坐標(biāo) x70, y100 的位置
context.lineTo(70, 100);
// 填充顏色
context.strokeStyle="red";
// 開始填充
context.stroke();
context.closePath();
切換回實(shí)線:
// 切換回實(shí)線
context.setLineDash([]);
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者