Método fillRect() del canvas HTML

Manual de referencia de HTML5 Canvas

Definición y uso

fillRect() Método para dibujar un rectángulo 'relleno'. El color de relleno predeterminado es negro.

Consejo:Por favor, utilice fillStyle Las propiedades se utilizan para establecer el color, la gradiente o el patrón de relleno del dibujo.

Ejemplo

Dibujar un rectángulo relleno de 150*100 píxeles:

Su navegador no admite la etiqueta de canvas HTML5.

JavaScript:

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

Pruebe usted mismo

Sintaxis

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

Valor del parámetro

Parámetros Descripción
x La coordenada x del extremo superior izquierdo del rectángulo.
y La coordenada y del extremo superior izquierdo del rectángulo.
width El ancho del rectángulo, en píxeles.
height La altura del rectángulo, en píxeles.

Compatibilidad del navegador

Los números en la tabla indican la versión del navegador que admite por primera vez esta propiedad.

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

Notas:Internet Explorer 8 y versiones anteriores no admiten el elemento <canvas>.

Manual de referencia de HTML5 Canvas