Canvas lineJoin 屬性
示例
在兩條線相交的地方建立一個圓角
JavaScript
const canvas = document.getElementById("myCanvas");
const ctx = canvas.getContext("2d");
ctx.beginPath();
ctx.lineJoin = "round";
ctx.moveTo(20, 20);
ctx.lineTo(100, 50);
ctx.lineTo(20, 100);
ctx.stroke();
自己動手試一試 »
描述
lineJoin
屬性用於設定或返回當兩條線相交時建立的角的型別。
合法值:bevel(斜角)、round(圓角)和 miter(尖角)(預設)。
注意
"miter" 值受 miterLimit 屬性的影響。
另請參閱
lineCap 屬性 (設定端點樣式)
lineJoin 屬性(設定連線帽)
lineWidth 屬性 (設定連線點樣式)
fillStyle 屬性 (設定填充顏色/樣式)
strokeStyle 屬性 (設定描邊顏色/樣式)
語法
context.lineJoin = "bevel|round|miter" |
屬性值
值 | 描述 | 試一試 |
---|---|---|
bevel(斜角) | 建立斜角 | 試一試 » |
round | 建立圓角 | 試一試 » |
miter(尖角) | 預設值。建立尖角 | 試一試 » |
瀏覽器支援
<canvas>
元素是 HTML5 標準(2014)。
lineJoin
在所有現代瀏覽器中都受支援
Chrome | Edge | Firefox | Safari | Opera | IE |
是 | 是 | 是 | 是 | 是 | 9-11 |
❮ Canvas 參考