HTML-Canvas- fill()- Methode
Beispiel
Zeichnen Sie zwei 150*100 Pixel große Rechtecke. Füllen Sie eine mit einer roten Farbe und die andere mit einer blauen Farbe:
JavaScript:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.rect(20, 20, 150, 100);
ctx.fillStyle = "red";
ctx.fill();
ctx.beginPath();
ctx.rect(40, 40, 150, 100);
ctx.fillStyle = "blue";
ctx.fill();
Browser-Unterstützung
Die Zahlen in der Tabelle geben die erste Browserversion an, die das Verfahren vollständig unterstützt.
Method | |||||
---|---|---|---|---|---|
fill() | Yes | 9.0 | Yes | Yes | Yes |
Definition und Verwendung
Die Methode fill() füllt die aktuelle Zeichnung (Pfad). Die Standardfarbe ist schwarz.
Tipp: Verwenden Sie die Eigenschaft fillStyle , um mit einer anderen Farbe/einem anderen Farbverlauf zu füllen.
Hinweis: Wenn der Pfad nicht geschlossen ist, fügt die Methode fill() eine Linie vom letzten Punkt zum Startpunkt des Pfads hinzu, um den Pfad zu schließen (wie closePath() ), und füllt dann den Pfad.
JavaScript-Syntax: | Kontext .fill(); |
---|
❮ HTML-Canvas-Referenz