Manuale di riferimento HTML

Completo di HTML tag

Metodo stroke() di HTML canvas

Il metodo stroke() di HTML canvas viene utilizzato per disegnare un percorso. Utilizza i metodi moveTo() e lineTo() per disegnare questo percorso.

Manuale di riferimento per HTML canvas

Esempio online

Disegna un percorso, la forma è la lettera L blu e poi disegna una linea verticale:

JavaScript:

Esempio

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Utilizzo del metodo stroke() di HTML canvas - Guida di base (oldtoolbag.com)</title>
</head>
<body>
<canvas id="myCanvas" width="300" height="150" style="border:1px solid #d3d3d3;">
Il suo browser non supporta il tag canvas HTML5.
</canvas>
<script>
var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20,20);
ctx.lineTo(20,100);
ctx.lineTo(70,100);
ctx.strokeStyle="blue";
ctx.stroke();
ctx.beginPath();
ctx.moveTo(100, 200);
ctx.lineTo(100, 100);
ctx.strokeStyle = "blue";
ctx.stroke();
</script>　
</body>
</html>

Testa per vedere ‹/›

Compatibilità dei browser

IEFirefoxOperaChromeSafari

Internet Explorer 9, Firefox, Opera, Chrome e Safari supportano stroke(). metodi.

Attenzione:Internet Explorer 8 e le versioni precedenti non supportano l'elemento <canvas>.

Definizione e uso

Il metodo stroke() disegna effettivamente il percorso definito da moveTo() e lineTo(). Il colore predefinito è nero.

Suggerimento:Utilizzare strokeStyle usare un'altro colore/gradiente. Proprietà:

Sintassi JavaScript:	context.stroke();

Manuale di riferimento per HTML canvas

HTML: <template> etichetta