miterLimit Özelliği
miterLimit özelliği,
lineJoin
özelliği miter değerine ayarlandığında
iki çizginin birleşiminin sivriliğini düzenler.
Nasıl düzenler:
eğer köşenin uzunluğu, miterLimit içinde
belirtilen sayıdan daha büyük olursa, çizgi birleşimi
lineJoin özelliğinin bevel değerine
ayarlanmış gibi davranır.
Varsayılan olarak miterLimit değeri 10'dur.
1'den daha düşük bir değer ayarlanamaz.
Sözdizimi
bağlam.lineJoin = 'miter' veya 'round' veya 'bevel';
Örnek
Şu anda lineJoin özelliği
miter değerine ayarlı, ancak henüz herhangi bir
kısıtlama olmadığı için köşe sivri:
<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();
:
Örnek
Şimdi ise miterLimit ile bir sınırlama belirleyelim:
<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();
:
Ayrıca Bakınız
-
çizginin sonunun görünümünü belirleyen
lineCapözelliği