1# ImageData
2
3>  **NOTE**
4>
5>  This component is supported since API version 4. Updates will be marked with a superscript to indicate their earliest API version.
6
7The **ImageData** object is an object that stores pixel data rendered on a [canvas](js-components-canvas-canvas.md).
8
9
10## Attributes
11
12| Name    | Type                       | Description                          |
13| ------ | ------------------------- | ---------------------------- |
14| width  | number                    | Actual width of the rectangle on the canvas, in pixels.                 |
15| height | number                    | Actual height of the rectangle on the canvas, in pixels.                 |
16| data   | <Uint8ClampedArray> | A one-dimensional array of color values. The values range from 0 to 255.|
17
18
19## Example
20
21```html
22<!-- xxx.hml -->
23<div>
24  <canvas ref="canvas" style="width: 500px; height: 500px; background-color: #ffff00;"></canvas>
25</div>
26```
27
28```js
29// xxx.js
30import promptAction from '@ohos.promptAction';
31export default {
32  onShow() {
33    const el =this.$refs.canvas;
34    const ctx = el.getContext('2d');
35    ctx.fillRect(0,0,200,200)
36    var imageData = ctx.createImageData(1,1)
37    promptAction.showToast({
38      message:imageData,
39      duration:5000
40    })
41  }
42}
43```
44