---
title: ImageData
slug: Web/API/ImageData
tags:
  - API
  - Canvas
  - DOM
  - Images
  - JavaScript
translation_of: Web/API/ImageData
---
<p>{{APIRef("Canvas API")}}</p>

<p>L'interface <code><strong>ImageData</strong></code> représente les données des pixels au sein d'une certaine zone dans un élément {{HTMLElement("canvas")}}. Elle est définie par les méthodes des constructeurs ou créateurs d'objet {{domxref("ImageData.ImageData", "ImageData()")}}  sur l'objet {{domxref("CanvasRenderingContext2D")}} associé à canevas,  {{domxref("CanvasRenderingContext2D.createImageData", "createImageData()")}} et  {{domxref("CanvasRenderingContext2D.getImageData", "getImageData()")}}. Elle peut être également utilisée pour redéfinir une partie du canevas en utilisant {{domxref("CanvasRenderingContext2D.putImageData", "putImageData()")}}.</p>

<h2 id="Constructeurs">Constructeurs</h2>

<dl>
 <dt>{{domxref("ImageData.ImageData", "ImageData()")}} {{experimental_inline}}</dt>
 <dd>Crée un objet ImageData à partir d'un {{jsxref ("Uint8ClampedArray")}} donné et la taille de l'image qu'il contient. Si aucun tableau n'est donné, il crée une image d'un rectangle noir. Notez que c'est la façon la plus courante de créer un tel objet dans les "Workers" car {{domxref ("CanvasRenderingContext2D.createImageData", "createImageData ()")}} n'y est pas disponible.</dd>
</dl>

<h2 id="Propriétés">Propriétés</h2>

<dl>
 <dt>{{domxref("ImageData.data")}}</dt>
 <dd>Un {{domxref("Uint8ClampedArray")}} représentant un tableau à une seule dimension contenant les données des pixels sous format RVBA, chaque valeur comprise entre <code>0</code> et <code>255</code> (inclus).</dd>
 <dt>{{domxref("ImageData.height")}} {{readonlyInline}}</dt>
 <dd>Un <code>unsigned</code> <code>long</code> représentant la hauteur effective, en pixels, de l'objet <code>ImageData</code>.</dd>
 <dt>{{domxref("ImageData.width")}} {{readonlyInline}}</dt>
 <dd>Un <code>unsigned</code> <code>long</code> représentant la largeur effective, en pixels, de l'objet <code>ImageData</code>.</dd>
</dl>

<h2 id="Spécifications">Spécifications</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Spécification</th>
   <th scope="col">Statut</th>
   <th scope="col">Commentaire</th>
  </tr>
 </thead>
 <tbody>
  <tr>
   <td>{{SpecName('HTML WHATWG', "the-canvas-element.html#imagedata", "ImageData")}}</td>
   <td>{{Spec2('HTML WHATWG')}}</td>
   <td> </td>
  </tr>
 </tbody>
</table>

<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>

<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à consulter <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a> et à nous envoyer une<em>pull request</em>.</div>

<p>{{Compat("api.ImageData")}}</p>

<h2 id="Voir_aussi">Voir aussi</h2>


<ul>
 <li>{{domxref("CanvasRenderingContext2D")}}.</li>
 <li>L'élément {{HTMLElement("canvas")}} et l'interface associée, {{domxref("HTMLCanvasElement")}}.</li>
</ul>