# ImageData

**ImageData** stores pixel data rendered on a canvas.

## Attribute



| Attribute | Type                | Description                                                  |
| --------- | ------------------- | ------------------------------------------------------------ |
| width     | number              | Actual width of the rectangle on the canvas, in pixels.      |
| height    | number              | Actual height of the rectangle on the canvas, in pixels.     |
| data      | \<Uint8ClampedArray> | A one-dimensional array of color values. The values range from 0 to 255. |

## Example

```
<!-- xxx.hml -->
<div>
  <canvas ref="canvas" style="width: 500px; height: 500px; background-color: #ffff00;"></canvas>
</div>
//xxx.js
import prompt from '@system.prompt';
export default {
  onShow() {
    const el =this.$refs.canvas;
    const ctx = el.getContext('2d');
    ctx.fillRect(0,0,200,200)
    var imageData = ctx.createImageData(1,1)
    prompt.showToast({
      message:imageData,
      duration:5000
    })
  }
}
```