canvas

Introducido en HTML5

El elemento HTML canvas (<canvas>) se puede utilizar para dibujar gráficos a través de secuencias de comandos (por lo general JavaScript ). Por ejemplo, puede usarse para dibujar gráficos, hacer composiciones de fotos o incluso realizar animaciones.

Las aplicaciones de Mozilla adquirieron la compatibilidad con <canvas> a partir de Gecko 1.8 (es decir, Firefox 1.5 ). El elemento fue originalmente introducido por Apple en el OS X Dashboard y Safari. Internet Explorer, antes de la versión 9.0 beta, no admite de forma nativa <canvas> , pero una página puede de hecho añadir la compatibilidad mediante la inclusión de un script del proyecto Explorer Canvas de Google. Opera 9 también es compatible con <canvas> .

Para más artículos sobre canvas, consulta la página del tema canvas .

Contexto de uso

Contenido permitido	Transparente, ya sea contenido estático o contenido dinámico .
Omisión de etiquetas	Ninguna, deben estar presentes tanto las etiquetas de inicio como las de cierre
Elementos primarios permitidos	Cualquier elemento que acepte contenido dinámico o cualquier otro elemento que acepte contenido estático .
Documento normativo	HTML 5, sección 4.8.10

Atributos

width: La anchura del espacio de coordenadas en píxeles CSS. El valor predeterminado es 300.
height: La altura del espacio de coordenadas en píxeles CSS. El valor predeterminado es 150.

Nota: el tamaño del lienzo mostrado se puede cambiar con una hoja de estilo. La imagen se escala durante la representación para adaptarse al tamaño que se le ha aplicado estilo .

Interfaz DOM

HTMLCanvasElement

Ejemplo

<canvas id="canvas" width="300" height="300">
  Tu navegador no admite el elemento &lt;canvas&gt;.
</canvas>

Consulta también

Tema sobre canvas