کانواس ڈاٹا صفت

کینوس مراجع دستاویز

تعریف اور استعمال

data صفت ایک اپنے آپ کا ایک آئیتم واپس فراہم کرتی ہے، جس میں مخصوص ImageData آئیٹم کا تصویر کا اعداد و شمار موجود ہیں。

لئکہ ImageData اپنے ہر پیکسل کے لئے چار جگہات کی معلومات موجود ہیں، یعنی RGBA کی وضاحت:

  • R - لال (0-255)
  • G - سبز (0-255)
  • B - نیلا (0-255)
  • A - آلفا چینل (0-255; 0 شفاف ہے، 255 پورا واضح ہے)

رنگ/آلفا کا شکل مائع کا نمودار میں موجود ہے، اور ImageData آئی-جی-اے کی میعاد موثر میں محفوظ ہے، data کی خصوصیات میں

مثال:

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 آئی-جی-اے کے بارے میں مزید معلومات حاصل کریں۔

مثال

100*100 پیکسل کا ImageData آئی-جی-اے بنائیں، جس میں ہر پیکسل کو لال رنگ میں ستیل کیا گیا ہے: :

آپ کا بروسر کینس کا تگ نہیں پشتیبانی کرتا۔

جاوا اسکریپت:

var c=document.getElementById("myCanvas");
var ctx=c.getContext("2d");
var imgData=ctx.createImageData(100,100);
برای (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);

خود کا تجربہ کریں

قواعد

imageData.data;

بروسر کی پشتیبانی

جداول میں دوسرے کسی بروسر کی نسخے کو مکمل طور پر اس کی خصوصیت کا حوالہ دیا گیا ہے۔

Chrome ایج فائرفاکس سافری آپرا
Chrome ایج فائرفاکس سافری آپرا
4.0 9.0 3.6 4.0 10.1

تعلیمات:اینٹرنیشنل ایکسپلورر 8 اور اس سے پچھلے کی نسلیں <کانووس> عینک کو نہیں سپورٹ کرتی ہیں۔

کینوس مراجع دستاویز