O melhor tutorial Objeto HTML DOM Canvas em 2024. Neste tutorial você pode aprender
objeto canvas,Cor, estilo, e sombras,Estilo da linha,retângulo,caminho,mudança,texto,renderização de imagem,operações de pixel,síntese,outro,propriedades e eventos padrão,artigos relacionados,
Objeto HTML DOM Canvas
objeto canvas
objeto Canvas é novo em HTML5.
tag HTML5 <canvas> é usada para desenhar uma imagem (um script é normalmente JavaScript).
Object Access Canvas
Você pode usar getElementById () para acessar o elemento <canvas>:
var x = document.getElementById("myCanvas");
尝试一下
Criar um objeto Canvas
Você pode usar o método document.createElement () para criar um elemento <canvas>:
var x = document.createElement("CANVAS");
尝试一下
Nota: <canvas> elemento em si não tem a capacidade de atrair (é apenas um contêiner gráfica) - Você deve usar um script para fazer a tarefa desenho real.
getContext () retorna um objeto que fornece métodos e propriedades para desenhar na tela.
Este manual fornece um propriedades getContext completas e métodos ( "2d") objeto que pode ser usado para desenhar o texto, linhas, retângulos, círculos, etc. na tela.
Cor, estilo, e sombras
Estilo da linha
retângulo
caminho
mudança
texto
renderização de imagem
operações de pixel
属性 |
描述 |
width |
返回 ImageData 对象的宽度。 |
height |
返回 ImageData 对象的高度。 |
data |
返回一个对象,其包含指定的 ImageData 对象的图像数据。 |
síntese
outro
方法 |
描述 |
save() |
保存当前环境的状态。 |
restore() |
返回之前保存过的路径状态和属性。 |
createEvent() |
|
getContext() |
|
toDataURL() |
|
propriedades e eventos padrão
objeto Canvas também suporta o padrão de atributos e eventos .
artigos relacionados
HTML Tutorial: HTML elemento <canvas>