Adicionado ao HTML5, o elemento HTML <canvas>
é um elemento que pode ser usado para desenhar gráficos via código (nomalmente JavaScript). Por exemplo, ele pode ser usado para desenhar gráficos, fazer composição de fotos, criar animações ou até mesmo fazer processamento de video em tempo real.
Aplicativos Mozilla ganharam suporte ao <canvas>
a partir do Gecko 1.8 (por exemplo Firefox 1.5). O elemento foi originalmente introduzido pela Apple para o OS X Dashboard e Safari. Internet Explorer suporta <canvas>
a partir da versão 9; para versões mais antigas do IE, uma página pode efetivamente adicionar suporte ao <canvas>
incluíndo um código do Google's Explorer Canvas project. Google Chrome e Opera 9 também suportam <canvas>
.
O elemento <canvas>
é também usado pelo WebGL para fazer aceleração gráfica por hardware nas páginas da web.
Documentação
- Especificação
- O elemento
<canvas>
é parte da especificação do WhatWG Web applications 1.0, também conhecida como HTML5. - Tutorial Canvas
- Um tutorial compreensivo abordando o uso básico do
<canvas>
e suas características avançadas. - Code snippets:Canvas
- Algumas extenções para desenvolvedores envolvendo
<canvas>
. - Exemplos com Canvas
- Algumas demonstrações com o
<canvas>
. - Desenhando objetos DOM dentro de um canvas
- Como desenhar um conteúdo DOM, tipo elementos HTML dentro de um canvas.
- A basic raycaster
- A demo of ray-tracing animation using canvas.
- Canvas DOM interfaces
- Canvas DOM interfaces on Gecko.
Comunidade
- View Mozilla forums...
- Canvas-Developers Yahoo Group
Resources
Libraries
- libCanvas is powerful and lightweight canvas framework
- Processing.js is a port of the Processing visualization language
- EaselJS is a library with a Flash-like API
- PlotKit is a charting and graphing library
- Rekapi is an animation keyframing API for Canvas
- PhiloGL is a WebGL framework for data visualization, creative coding and game development.
- JavaScript InfoVis Toolkit creates interactive 2D Canvas data visualizations for the Web.
- Frame-Engine is a framework for developping applications and games