Latest web development tutorials

canvas HTML putImageData () Método

HTML Manual de lona Referência HTML Manual de lona Referência

Exemplos

Os seguintes getImageData código () Cópia de dados de pixel de lona retângulo designado, e () os dados de imagem de volta para a tela por putImageData:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="red";
ctx.fillRect(10,10,50,50);

function copy()
{
var imgData=ctx.getImageData(10,10,50,50);
ctx.putImageData(imgData,10,70);
}

tente »

Suporte a navegadores

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9, suporte Firefox, Opera, Chrome e Safari putImageData () método.

Nota: 8 e versões anteriores do Internet Explorer não suportam o elemento <canvas>.


Definição e Uso

putImageData () método dos dados de imagem (a partir dos objetos ImageData especificados) de volta na tela.

Dica: Veja getImageData () método, ele pode copiar o retângulo de dados de pixel especificadas na tela.

Dica: Veja createImageData () método, que cria um novo objeto ImageData em branco.


sintaxe JavaScript

sintaxe JavaScript: contexto .putImageData (imgData, X, Y, dirtyX, dirtyY, dirtyWidth, dirtyHeight);

parâmetro Valor

参数 描述
imgData 规定要放回画布的 ImageData 对象。
x ImageData 对象左上角的 x 坐标,以像素计。
y ImageData 对象左上角的 y 坐标,以像素计。
dirtyX 可选。水平值(x),以像素计,在画布上放置图像的位置。
dirtyY 可选。垂直值(y),以像素计,在画布上放置图像的位置。
dirtyWidth 可选。在画布上绘制图像所使用的宽度。
dirtyHeight 可选。在画布上绘制图像所使用的高度。


HTML Manual de lona Referência HTML Manual de lona Referência