The ImageData interface represents the underlying pixel data of an area of a <canvas> element. It is created using the ImageData() constructor or creator methods on the CanvasRenderingContext2D object associated with a canvas: createImageData() and getImageData(). It can also be used to set a part of the canvas by using putImageData().
Constructors
ImageData()- Creates an
ImageDataobject from a givenUint8ClampedArrayand 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.
Properties
ImageData.dataRead only- Is a
Uint8ClampedArrayrepresenting a one-dimensional array containing the data in the RGBA order, with integer values between0and255(inclusive). ImageData.heightRead only- Is an
unsigned longrepresenting the actual height, in pixels, of theImageData. ImageData.widthRead only- Is an
unsigned longrepresenting the actual width, in pixels, of theImageData.
Specifications
| Specification | Status | Comment |
|---|---|---|
| HTML Living Standard The definition of 'ImageData' in that specification. |
Living Standard |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
ImageData | Chrome Full support 4 | Edge Full support 12 | Firefox Full support 14 | IE Full support 9 | Opera Full support 9 | Safari Full support 3.1 | WebView Android Full support ≤37 | Chrome Android Full support 18 | Firefox Android Full support 14 | Opera Android Full support 10.1 | Safari iOS Full support 3.2 | Samsung Internet Android Full support 1.0 |
ImageData() constructor | Chrome Full support 42 | Edge Full support ≤18 | Firefox Full support 29 | IE No support No | Opera Full support 29 | Safari ? | WebView Android No support No | Chrome Android Full support 42 | Firefox Android Full support 29 | Opera Android ? | Safari iOS ? | Samsung Internet Android Full support 4.0 |
data | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 14 | IE Full support 9 | Opera Full support 9 | Safari Full support 3.1 | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support 14 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
height | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 14 | IE Full support 9 | Opera Full support 9 | Safari Full support 3.1 | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support 14 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
width | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 14 | IE Full support 9 | Opera Full support 9 | Safari Full support 3.1 | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support 14 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
| Available in workers | Chrome Full support Yes | Edge Full support ≤79 | Firefox Full support 25 | IE ? | Opera ? | Safari ? | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support 25 | Opera Android ? | Safari iOS ? | Samsung Internet Android Full support Yes |
Legend
- Full support
- Full support
- No support
- No support
- Compatibility unknown
- Compatibility unknown
- Experimental. Expect behavior to change in the future.
- Experimental. Expect behavior to change in the future.
See also
CanvasRenderingContext2D- The
<canvas>element and its associated interface,HTMLCanvasElement.
