ImageData

Baseline Widely available *

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨July 2015⁩.

* Some parts of this feature may have varying levels of support.

Note: This feature is available inWeb Workers.

TheImageData interface represents the underlying pixel data of an area of a<canvas> element.

It is created using theImageData() constructor or creator methods on theCanvasRenderingContext2D object associated with a canvas:createImageData() andgetImageData(). It can also be used to set a part of the canvas by usingputImageData().

Constructors

ImageData(): Creates anImageData object from a givenUint8ClampedArray orFloat16Array and the size of the image it contains. If no array is given, it creates an image of a transparent black rectangle. Note that this is the most common way to create such an object in workers ascreateImageData() is not available there.

ImageData.dataRead only: AUint8ClampedArray orFloat16Array representing a one-dimensional array containing the data in the RGBA order. The order goes by rows from the top-left pixel to the bottom-right.
ImageData.colorSpaceRead only: A string indicating the color space of the image data.
ImageData.heightRead only: Anunsigned long representing the actual height, in pixels, of theImageData.
ImageData.widthRead only: Anunsigned long representing the actual width, in pixels, of theImageData.
ImageData.pixelFormatRead onlyExperimental: A string indicating the format to use for theImageData.