HTML canvas closePath() Methode
Definition und Verwendung
closePath() Methode, um einen Pfad von der aktuellen Position zum Ausgangspunkt zu erstellen.
Hinweis:Verwenden Sie bitte stroke() Methode, um den genauen Pfad auf der Leinwand zu zeichnen.
Hinweis:Verwenden Sie bitte fill() Verwenden Sie die Methode, um ein Bild zu füllen (Standard ist schwarz). Verwenden Sie bitte fillStyle Eigenschaften, um eine andere Farbe/Verlauf zu füllen.
Beispiel
Beispiel 1
Zeichnen Sie einen Pfad in Form des Buchstaben L und zeichnen Sie dann Linien, um zum Ausgangspunkt zurückzukehren:
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();
Hinweis:Mehr Beispiele am Seitenende.
Syntax
context.closePath();
Mehr Beispiele
Beispiel 2
Grün als Füllfarbe verwenden:
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();
Browserunterstützung
Die in der Tabelle genannten Zahlen geben die erste Browserversion an, die diese Eigenschaft vollständig unterstützt.
| Chrome | Edge | Firefox | Safari | Opera |
|---|---|---|---|---|
| Chrome | Edge | Firefox | Safari | Opera |
| 4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
Anmerkung:Internet Explorer 8 und frühere Versionen unterstützen das <canvas>-Element nicht.
