Manuel de référence HTML

Tous les étiquettes HTML

Attribut miterLimit pour HTML canvas

miterLimit est Canvas 2L'attribut D API définit la proportion de limitation de la surface de raccordement. Lorsque l'attribut est récupéré, il renvoie la valeur actuelle (la valeur par défaut est10.0 ). Lorsque l'attribut est assigné, 0, nombre négatif, Infinity et NaN seront ignorés; tout le reste sera attribué une nouvelle valeur.

Guide de référence HTML canvas

Exemple en ligne

Dessiner une longueur maximale d'angle de raccordement de20 ligne :

Exemple

!DOCTYPE html>
<html>
<head>
<title>Utilisation de l'attribut miterLimit pour HTML canvas (Tutoriel de base du site web oldtoolbag.com)</title>
</head>
<body>
<canvas id="myCanvas" width="300" height="150" style="border:1px solide #d3d3d3>
Votre navigateur ne prend pas en charge HTML5　étiquette canvas.
</canvas>
<p>Essayer de définir miterLimit　4(Puis, la longueur de l'angle de raccordement dépassera la limite de raccordement, lorsque la ligne satisfait elle sera affichée comme lineJoin = "bevel".).</p>
<script>
var　c=document.getElementById("myCanvas");
var　ctx=c.getContext("2d");
ctx.lineWidth=10;
ctx.lineJoin="miter";
ctx.miterLimit=20;
ctx.moveTo(20,20);
ctx.lineTo(50,27);
ctx.lineTo(20,34);
ctx.stroke();
</script>
</body>
</html>

Voyons si ‹/›

Compatibilité du navigateur

IEFirefoxOperaChromeSafari

Internet Explorer 9Firefox, Opera, Chrome et Safari prennent en charge l'attribut miterLimit.

Attention :Internet Explorer 8 Les versions précédentes de et inclusives ne prennent pas en charge l'élément <canvas>.

Définition et utilisation

L'attribut miterLimit définit ou retourne la longueur maximale de l'angle.

La longueur de l'angle est la distance entre l'angle interne et l'angle externe à la jonction des deux lignes.

Astuce :L'attribut miterLimit est efficace uniquement lorsque l'attribut lineJoin est "miter".

Plus le coin est petit, plus la longueur de l'angle est grande.

Pour éviter la longueur de l'angleTrop long，nous pouvons utiliser l'attribut miterLimit.

Si la longueur de l'angle dépasse la valeur de miterLimit, les coins s'affichent avec le type "bevel" de lineJoin (Fig 3）：

Valeur par défaut :	10
Syntaxe JavaScript :	context.miterLimit=number;

Valeur de l'attribut

Valeur	Description
number	Nombre positif. Définit la longueur maximale de l'angle. Si la longueur de l'angle dépasse la valeur de miterLimit, les coins s'affichent avec le type "bevel" de lineJoin.

Guide de référence HTML canvas

HTML: <template> balise