Proprietatea miterLimit
Proprietatea miterLimit reglează ascuțimea
îmbinării a două linii în cazul în care
proprietatea lineJoin
este setată la valoarea miter. Cum reglează:
dacă lungimea unghiului devine mai mare decât numărul,
setat în miterLimit, atunci îmbinarea liniilor
se comportă ca și cum lineJoin ar fi setat la valoarea
bevel.
În mod implicit miterLimit are valoarea 10.
Mai puțin de 1 nu i se poate seta valoarea.
Sintaxă
context.lineJoin = 'miter' sau 'round' sau 'bevel';
Exemplu
Acum proprietatea lineJoin este setată
la valoarea miter, dar încă nu există
restricții, unghiul este ascuțit:
<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();
:
Exemplu
Iar acum setăm o restricție cu ajutorul
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();
:
Vedeți și
-
proprietatea
lineCap,
care stabilește aspectul capătului liniei
