Método strokeRect() de canvas HTML

Definición y uso

strokeRect() Método para dibujar un rectángulo (sin rellenar). El color predeterminado del trazo es negro.

Consejo:Por favor utilice strokeStyle Atributo para establecer el color, gradiente o patrón del trazo.

Ejemplo

Dibujar un rectángulo 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.strokeRect(20,20,150,100);

Prueba por tu cuenta

Sintaxis

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

Valor del parámetro

Parámetros Descripción
x Coordenada x del vértice superior izquierdo del rectángulo.
y Coordenada y del vértice superior izquierdo del rectángulo.
width Anchura del rectángulo, en píxeles.
height 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

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