Latest web development tutorials

HTML canvas putImageData () metode

Pedoman kanvas Referensi HTML Pedoman kanvas Referensi HTML

contoh

The getImageData kode berikut () Salin data pixel kanvas persegi panjang yang ditunjuk, dan () data gambar kembali ke kanvas oleh 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);
}

Coba »

Dukungan Browser

Internet ExplorerFirefoxOperaGoogle ChromeSafari

Internet Explorer 9, dukungan Firefox, Opera, Chrome dan Safari putImageData () metode.

Catatan: 8 dan versi sebelumnya dari Internet Explorer tidak mendukung <canvas> elemen.


Definisi dan Penggunaan

putImageData () metode data gambar (dari benda imageData yang ditentukan) kembali di kanvas.

Tip: Lihat getImageData () metode, dapat menyalin persegi panjang data pixel ditentukan di kanvas.

Tip: Lihat createImageData () metode, yang menciptakan kosong objek imageData baru.


sintaks JavaScript

sintaks JavaScript: konteks .putImageData (imgData, x, y, dirtyX, dirtyY, dirtyWidth, dirtyHeight);

Nilai parameter

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


Pedoman kanvas Referensi HTML Pedoman kanvas Referensi HTML