En son web geliştirme öğreticiler
 

HTML canvas ImageData data Propery

<HTML Tuval Referans

Örnek

Bir oluşturma 100*100 her piksel kırmızı renk olarak ayarlanır piksel ImageData nesnesi:

Tuval

YourbrowserdoesnotsupporttheHTML5canvastag.

JavaScript:

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);
Kendin dene "

Tarayıcı Desteği

Tablodaki rakamlar tam özelliğini destekleyen ilk tarayıcı sürümü belirtin.

özellik
data Evet 9.0 Evet Evet Evet

Tanımı ve Kullanımı

Veri özelliği belirtilen ImageData nesnesinin resim verileri içeren bir nesne döndürür.

Bir ImageData nesnesindeki her piksel için bilgi, RGBA değerleri dört adet vardır:

R - kırmızı renk (from 0-255)
G - yeşil renk (from 0-255)
B - mavi renk (from 0-255)
A - alfa kanalı (from 0-255; 0 is transparent and 255 is fully visible)

Renk / alfa bilgiler bir dizi içinde tutulur ve ImageData nesnesinin veri özelliği saklanır.

Examples:

ImageData ilk pikseli yapmak için sözdizimi kırmızı nesne:

imgData=ctx.createImageData(100,100);

imgData.data[0]=255;
imgData.data[1]=0;
imgData.data[2]=0;
imgData.data[3]=255;

ImageData nesne yeşil ikinci pikseli yapmak için sözdizimi:

imgData=ctx.createImageData(100,100);

imgData.data[4]=0;
imgData.data[5]=255;
imgData.data[6]=0;
imgData.data[7]=255;

Tip: bak createImageData() , getImageData() ve putImageData() ImageData nesnesi hakkında daha fazla bilgi edinmek için.


JavaScript sözdizimi

JavaScript sözdizimi: imageData .data;

<HTML Tuval Referans