Sifat miterLimit
Sifat miterLimit mengawal ketajaman
sambungan dua garis dalam kes apabila
sifat lineJoin
ditetapkan kepada nilai miter. Cara kawalan:
jika panjang sudut didapati lebih besar daripada nombor,
yang ditetapkan dalam miterLimit, maka sambungan garis
berkelakuan seolah-olah lineJoin ditetapkan kepada nilai
bevel.
Secara lalai miterLimit mempunyai nilai 10.
Kurang daripada 1 nilainya tidak boleh ditetapkan.
Sintaks
konteks.lineJoin = 'miter' atau 'round' atau 'bevel';
Contoh
Sekarang sifat lineJoin ditetapkan
kepada nilai miter, tetapi buat masa ini tiada
sekatan yang ditetapkan, sudut adalah tajam:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.lineWidth = 10;
ctx.moveTo(50, 140);
ctx.lineTo(100, 30);
ctx.lineTo(150, 140);
ctx.stroke();
:
Contoh
Dan sekarang tetapkan sekatan dengan menggunakan
miterLimit:
<canvas id="canvas" width="200" height="200" style="background: #f4f4f4;"></canvas>
let canvas = document.querySelector('#canvas');
let ctx = canvas.getContext('2d');
ctx.beginPath();
ctx.lineWidth = 10;
ctx.miterLimit = 1;
ctx.moveTo(50, 140);
ctx.lineTo(100, 30);
ctx.lineTo(150, 140);
ctx.stroke();
:
Lihat juga
-
sifat
lineCap,
yang menetapkan rupa hujung garis
