U leest de Engelstalige versie van deze inhoud, omdat er nog geen vertaling voor deze taal beschikbaar is. Help ons dit artikel te vertalen!
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 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.
Update compatibility data on GitHub
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
ImageData | Chrome Full support 4 | Edge Full support Yes | 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 10.1 | Safari iOS Full support 3.2 | Samsung Internet Android Full support Yes |
ImageData() constructor | Chrome Full support 42 | Edge Full support Yes | 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 ? | 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 ? |
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.