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
ImageData
object from a givenUint8ClampedArray
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.
Properties
ImageData.data
Read only- Is a
Uint8ClampedArray
representing a one-dimensional array containing the data in the RGBA order, with integer values between0
and255
(inclusive). ImageData.height
Read only- Is an
unsigned long
representing the actual height, in pixels, of theImageData
. ImageData.width
Read only- Is an
unsigned long
representing 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.
Update compatibility data on GitHub
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
.