مثال
إنشاء 100*100 كائن ImageData بكسل حيث يتم تعيين كل بكسل إلى اللون الأحمر:
قماش
جافا سكريبت:
var c=document.getElementById("myCanvas");
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); انها محاولة لنفسك » دعم المتصفح
الأرقام في الجدول تحدد أول نسخة متصفح يدعم بشكل كامل العقار.
| الملكية | |||||
|---|---|---|---|---|---|
| data | نعم فعلا | تسعة | نعم فعلا | نعم فعلا | نعم فعلا |
تعريف واستخدام
الخاصية البيانات بإرجاع كائن يحتوي على بيانات الصورة من وجوه ImageData محدد.
لكل بكسل في كائن ImageData هناك أربع قطع من المعلومات والقيم رغبا:
R - اللون الأحمر (0-255)
G - اللون الأخضر (0-255)
B - اللون الأزرق (0-255)
A - قناة ألفا (0-255، 0 شفافة و 255 مرئيا بالكامل)
ويعقد معلومات اللون / ألفا في صفيف، وتخزينها في الممتلكات بيانات من وجوه ImageData.
الأمثلة على ذلك:
بناء الجملة من أجل جعل بكسل الأول في ImageData يعترض الأحمر:
imgData=ctx.createImageData(100,100);
imgData.data[0]=255;
imgData.data[1]=0;
imgData.data[2]=0;
imgData.data[3]=255;بناء الجملة من أجل جعل بكسل الثاني في المنطقة الخضراء الكائن ImageData:
imgData=ctx.createImageData(100,100);
imgData.data[4]=0;
imgData.data[5]=255;
imgData.data[6]=0;
imgData.data[7]=255;نصيحة: انظروا createImageData() ، getImageData() ، و putImageData() لمزيد من المعلومات حول الكائن ImageData.
جافا سكريبت بناء الجملة
| جافا سكريبت بناء الجملة: | imageData.data; |
|---|