Canvas putImageData() Metodu

Canvas referans kitabı

Tanım ve Kullanım

putImageData() Metod, belirli bir ImageData nesnesinden gelen resim verilerini kanvasa geri döndürebilir.

İpucu:Ayrıca bakınız getImageData() Metod, belirli bir kanvasta矩形的像素 verilerini kopyalayabilir.

İpucu:Ayrıca bakınız createImageData() Metod, yeni boş ImageData nesnesi oluşturabilir.

Örnek

Aşağıdaki kod, getImageData() ile belirtilen kanvasta矩形的像素数据 kopyalar, ardından putImageData() ile resim verilerini kanvasa geri döndürür:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
ctx.fillStyle="green";
ctx.fillRect(10,10,50,50);
function copy()
{
var imgData=ctx.getImageData(10,10,50,50);
ctx.putImageData(imgData,10,70);
}

Kişisel olarak deneyin

Sözdizimi

context.putImageData(imgData,x,y,dirtyX,dirtyY,dirtyWidth,dirtyHeight);

Parametre değeri

Parametre Açıklama
imgData Kanvasta geri döndürülecek olan ImageData nesnesini tanımlar.
x ImageData nesnesinin sol üst köşesinin x koordinatı, pixedel cinsinden.
y ImageData nesnesinin sol üst köşesinin y koordinatı, pixedel cinsinden.
dirtyX İsteğe bağlı. Pixedel cinsinden yatay değeri (x), kanvasta resmin konumlandırıldığı yer.
dirtyY İsteğe bağlı. Pixedel cinsinden yatay değeri (y), kanvasta resmin konumlandırıldığı yer.
dirtyWidth İsteğe bağlı. Kanvasta resim çizmek için kullanılan genişlik.
dirtyHeight İsteğe bağlı. Kanvasta resim çizmek için kullanılan yükseklik.

Tarayıcı desteği

Tablo içindeki rakamlar, bu özelliği ilk tam olarak destekleyen tarayıcı sürümünü belirtmektedir.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
4.0 9.0 3.6 4.0 10.1

Açıklama:Internet Explorer 8 ve daha eski sürümler <canvas> elementini desteklememektedir.

Canvas referans kitabı