Metodo HTML canvas closePath()

Definizione e uso

closePath() Metodo per creare un percorso dalla posizione corrente al punto di partenza.

Suggerimento:Usa stroke() Metodo per disegnare esattamente il percorso sulla superficie.

Suggerimento:Usa fill() Metodo per riempire un'immagine (predefinito è nero). Usa fillStyle Proprietà per riempire un altro colore/gradiente.

Esempi

Esempio 1

Disegna un percorso con la forma della lettera L e poi disegna linee per tornare al punto di partenza:

Il tuo browser non supporta il tag canvas HTML5.

JavaScript:

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.closePath();
ctx.stroke();

Prova da solo

Suggerimento:Più esempi sono disponibili nella parte inferiore della pagina.

Sintassi

context.closePath();

Più esempi

Esempio 2

Imposta il verde come colore di riempimento:

Il tuo browser non supporta il tag canvas HTML5.

JavaScript:

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.closePath();
ctx.stroke();
ctx.fillStyle="green";
ctx.fill();

Prova da solo

Supporto dei browser

I numeri nella tabella indicano la versione del browser che supporta per la prima volta questa proprietà.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

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