Propriété miterLimit du Canvas

❮ Référence Canvas

Exemple

Dessinez des lignes avec une longueur maximale de miter de 5 :

Votre navigateur ne prend pas en charge la balise HTML5 canvas.

JavaScript :

const canvas = document.getElementById("myCanvas");
const ctx = canvas.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();
Essayez-le vous-même »

Description

La propriété miterLimit définit ou renvoie la longueur maximale de miter.

La propriété miterLimit est utilisée pour éviter qu'une longueur de miter soit trop longue.

La propriété miterLimit ne fonctionne que si l'attribut lineJoin est "miter".

La valeur par défaut est 10.

La longueur de miter est la distance entre le coin intérieur et le coin extérieur où deux lignes se rencontrent.

Figure de la limite de miter 1

La longueur de miter augmente à mesure que l'angle du coin diminue.

Si la longueur de miter dépasse la valeur de miterLimit, le coin sera affiché comme type lineJoin "bevel" (Fig 3) :

Figure de la limite de miter 2

Voir aussi :

La propriété lineJoin (Définir les caps de jointure)

La propriété lineWidth (Définir la largeur de ligne)


Syntaxe

context .miterLimit = number

Valeurs de propriété

Valeur Description Jouez-le
number La longueur maximale de miter. Si la longueur de miter dépasse le miterLimit, le coin sera affiché comme lineJoin "bevel". Jouez-le »

Support des navigateurs

L'élément <canvas> est une norme HTML5 (2014).

miterLimit est pris en charge dans tous les navigateurs modernes :

Chrome Edge Firefox Safari Opera IE
Oui Oui Oui Oui Oui 9-11

❮ Référence Canvas