Canvas fillRect() Methode

Definition und Verwendung

fillRect() Methode zum Zeichnen eines "gefüllten" Rechtecks. Die Standardfüllfarbe ist schwarz.

Ratschlag:Hinweis: fillStyle Eigenschaften, um die Farbe, den Farbverlauf oder das Muster zu setzen, die für die Füllung des Zeichens verwendet werden.

Beispiel

Zeichnen Sie einen 150*100 Pixel großen gefüllten Rechteck:

Ihr Browser unterstützt das HTML5 Canvas-Tag nicht.

JavaScript:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillRect(20,20,150,100);

Probieren Sie es selbst aus

Syntax

context.fillRect(x,y,width,height);

Parameterwert

Parameter Beschreibung
x X-Koordinate des linken oberen Ecks des Rechtecks.
y Y-Koordinate des linken oberen Ecks des Rechtecks.
width Rechteckbreite in Pixeln.
height Die Höhe des Rechtecks in Pixeln.

Browser-Unterstützung

Die in der Tabelle genannten Zahlen beziehen sich auf die erste Version des Browsers, 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.