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 given Uint8ClampedArray
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 as createImageData()
is not available there.
Instance properties
-
ImageData.data
Read only
-
A Uint8ClampedArray
representing a one-dimensional array containing the data in the RGBA order, with integer values between 0
and 255
(inclusive). The order goes by rows from the top-left pixel to the bottom-right.
-
ImageData.colorSpace
Read only
-
A string indicating the color space of the image data.
-
ImageData.height
Read only
-
An unsigned long
representing the actual height, in pixels, of the ImageData
.
-
ImageData.width
Read only
-
An unsigned long
representing the actual width, in pixels, of the ImageData
.
Specifications
Browser compatibility
|
Desktop |
Mobile |
|
Chrome |
Edge |
Firefox |
Internet Explorer |
Opera |
Safari |
WebView Android |
Chrome Android |
Firefox for Android |
Opera Android |
Safari on IOS |
Samsung Internet |
ImageData |
36 |
14 |
29 |
No |
23 |
8 |
37 |
36 |
29 |
24 |
8 |
3.0 |
ImageData |
1 |
12 |
3.5 |
9 |
9 |
3.1 |
≤37 |
18 |
4 |
10.1 |
2 |
1.0 |
colorSpace |
92 |
92 |
No |
No |
78 |
15.2 |
92 |
92 |
No |
65 |
15.2 |
16.0 |
data |
1 |
12 |
3.5 |
9 |
9 |
3.1 |
≤37 |
18 |
4 |
10.1 |
2 |
1.0 |
height |
1 |
12 |
3.5 |
9 |
9 |
3.1 |
≤37 |
18 |
4 |
10.1 |
2 |
1.0 |
width |
1 |
12 |
3.5 |
9 |
9 |
3.1 |
≤37 |
18 |
4 |
10.1 |
2 |
1.0 |
worker_support |
36 |
14 |
25 |
No |
23 |
7 |
37 |
36 |
25 |
24 |
7 |
3.0 |
See also