HTML canvas imageData data Property

Example

// Accessing the element
let c = document.getElementById("myCanvas");

let ctx = c.getContext("2d");
let imgData = ctx.createImageData(100, 100);

let i;
for (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, 25, 25);

// Creating function
function myFunction(){
  alert("Data of imgData is: " + imgData.data);
}

Try this code ❯

Meaning

The imageData data canvas property returns an object that contains image data of a specified ImageData object.

Standard Syntax

JavaScript syntax:

context.imagedata.data;