Attribut miterLimit du canvas
Définition et utilisation
miterLimit
Définit et retourne la longueur maximale de l'angle de raccordement.
La longueur de l'angle de raccordement fait référence à la distance entre l'angle interne et l'angle externe au point de croisement des deux lignes.

Astuce :Uniquement lorsque l'attribut lineJoin est "miter
lorsque miterLimit est efficace.
Plus l'angle du coin est petit, plus la longueur de l'angle de raccordement est grande.
Pour éviter que la longueur de l'angle de raccordement ne soit trop grande, nous pouvons utiliser l'attribut miterLimit.
Si la longueur de l'angle de raccordement dépasse la valeur de miterLimit, les coins seront affichés avec le type de raccordement "bevel
du type (diagramme 3) :

Exemple
Tracez une ligne avec la longueur maximale de l'angle de raccordement de 5 :
JavaScript:
var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.lineWidth=10; ctx.lineJoin="miter"; ctx.miterLimit=5; ctx.moveTo(20,20); ctx.lineTo(50,27); ctx.lineTo(20,34); ctx.stroke();
Syntaxe
context.miterLimit=number;
Valeur de l'attribut
Valeur | Description |
---|---|
number |
Nombre positif. Définit la longueur maximale de l'angle de raccordement. Si la longueur de l'angle de raccordement dépasse la valeur de miterLimit, les coins seront affichés avec le type de raccordement "bevel" de lineJoin. |
Détails techniques
Valeur par défaut : | 10 |
---|
Prise en charge du navigateur
Les numéros dans le tableau indiquent la version du navigateur qui prend en charge cette propriété pour la première fois.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Remarque :Les versions 8 et antérieures d'Internet Explorer ne prennent pas en charge l'élément <canvas>.