HTML kanvas atribut imageData Data
contoh
Buat 100 * 100 objek piksel imageData, di mana setiap pixel diatur ke merah:
kanvas
JavaScript:
var ctx=c.getContext("2d");
var imgData=ctx.createImageData(100,100);
for (var i=0;i<imgData.data.length;i+=4)
{
imgData.data[i+0]=255;
imgData.data[i+1]=0;
imgData.data[i+2]=0;
imgData.data[i+3]=255;
}
ctx.putImageData(imgData,10,10);
Coba »
Dukungan Browser
Internet Explorer 9, Firefox, Opera, Chrome dan dukungan Safari atribut imageData data.
Catatan: 8 dan versi sebelumnya dari Internet Explorer tidak mendukung <canvas> elemen.
Definisi dan Penggunaan
Properti Data mengembalikan sebuah objek yang berisi objek imageData data gambar yang ditentukan.
ImageData objek untuk setiap pixel, ada empat bidang informasi, yaitu nilai-nilai RGBA:
R - red (0-255)
G - Hijau (0-255)
B - biru (0-255)
A - channel alpha (0-255; 0 transparan, 255 adalah sepenuhnya terlihat)
informasi warna / alpha dalam bentuk array dan disimpan dalam data atribut objek imageData.
contoh:
The imageData keberatan pixel pertama yang sintaks merah:
imgData.data[0]=255;
imgData.data[1]=0;
imgData.data[2]=0;
imgData.data[3]=255;
Objek imageData pixel kedua ternyata sintaks hijau:
imgData.data[4]=0;
imgData.data[5]=255;
imgData.data[6]=0;
imgData.data[7]=255;
Tip: Lihat createImageData () , getImageData () dan putImageData () metode untuk mendapatkan pengetahuan lebih tentang imageData objek.
sintaks JavaScript
sintaks JavaScript: | imageData DATA; |
---|
Pedoman kanvas Referensi HTML