From 1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde Mon Sep 17 00:00:00 2001 From: julieng Date: Sat, 2 Oct 2021 17:20:24 +0200 Subject: convert content to md --- .../canvasrenderingcontext2d/getimagedata/index.md | 108 +++++++++------------ 1 file changed, 46 insertions(+), 62 deletions(-) (limited to 'files/fr/web/api/canvasrenderingcontext2d/getimagedata') diff --git a/files/fr/web/api/canvasrenderingcontext2d/getimagedata/index.md b/files/fr/web/api/canvasrenderingcontext2d/getimagedata/index.md index 94059efba8..e49af96a35 100644 --- a/files/fr/web/api/canvasrenderingcontext2d/getimagedata/index.md +++ b/files/fr/web/api/canvasrenderingcontext2d/getimagedata/index.md @@ -14,88 +14,72 @@ tags: - getImageDate translation_of: Web/API/CanvasRenderingContext2D/getImageData --- -
{{APIRef}}
+{{APIRef}} -

La méthode CanvasRenderingContext2D.getImageData() de l'API Canvas 2D retourne un  objet {{domxref("ImageData")}} représentant les données de pixels sous-jacentes pour la zone du canevas désigné par le rectangle qui commence aux positions (sx, sy) et qui possède des attributs : largeur (sw) et hauteur (sh). Cette méthode n'est pas affectée par la matrice de transformation du canevas.

+La méthode **`CanvasRenderingContext2D`\*\***`.getImageData()`\*_ de l'API Canvas 2D retourne un  objet {{domxref("ImageData")}} représentant les données de pixels sous-jacentes pour la zone du canevas désigné par le rectangle qui commence aux positions _(sx, sy)* et qui possède des attributs : *largeur (sw*) et *hauteur* (*sh)\*. Cette méthode n'est pas affectée par la matrice de transformation du canevas. -

Les pixels en dehors de la zone de canevas sont présents sous forme de valeurs noires transparentes dans les données d'image renvoyées.

+Les pixels en dehors de la zone de canevas sont présents sous forme de valeurs noires transparentes dans les données d'image renvoyées. -

Syntaxe

+## Syntaxe -
ImageData ctx.getImageData(sx, sy, sw, sh);
-
+ ImageData ctx.getImageData(sx, sy, sw, sh); -

Paramètres

+### Paramètres -
-
sx
-
La coordonnée x du coin supérieur gauche du rectangle à partir duquel ImageData sera extrait.
-
sy
-
La coordonnée y du coin supérieur gauche du rectangle à partir duquel ImageData  sera extrait.
-
sw
-
La largeur du rectangle à partir duquel ImageData sera extrait.
-
sh
-
La hauteur du rectangle à partir duquel ImageData sera extrait.
-
+- `sx` + - : La coordonnée x du coin supérieur gauche du rectangle à partir duquel _ImageData_ sera extrait. +- `sy` + - : La coordonnée y du coin supérieur gauche du rectangle à partir duquel \*ImageData\***\* \*** sera extrait. +- `sw` + - : La largeur du rectangle à partir duquel \*ImageData** \***sera extrait. +- `sh` + - : La hauteur du rectangle à partir duquel \*ImageData** \***sera extrait. -

Valeur retournée

+### Valeur retournée -

Un objet {{domxref("ImageData")}}  contenant les données de l'image pour le rectangle donné du canevas.

+Un objet {{domxref("ImageData")}}  contenant les données de l'image pour le rectangle donné du canevas. -

Erreurs renvoyées

+### Erreurs renvoyées -
-
IndexSizeError
-
Renvoyé si l'un des arguments de  largeur ou de hauteur est égal à zéro.
-
+- `IndexSizeError` + - : Renvoyé si l'un des arguments de  largeur ou de hauteur est égal à zéro. -

Exemples

+## Exemples -

Utilisation de la méthode  getImageData

+### Utilisation de la méthode  `getImageData` -

Ceci est juste un petit exemple qui utilise la méthode getImageData. Pour plus d'informations, visitez  Manipulation de pixels avec canvas et l'objet {{domxref("ImageData")}}.

+Ceci est juste un petit exemple qui utilise la méthode getImageData. Pour plus d'informations, visitez  [Manipulation de pixels avec canvas](/fr/docs/Tutoriel_canvas/Pixel_manipulation_with_canvas) et l'objet {{domxref("ImageData")}}. -

HTML

+#### HTML -
<canvas id="canvas"></canvas>
-
+```html + +``` -

JavaScript

+#### JavaScript -
var canvas = document.getElementById('canvas');
+```js
+var canvas = document.getElementById('canvas');
 var ctx = canvas.getContext('2d');
 ctx.rect(10, 10, 100, 100);
 ctx.fill();
 
 console.log(ctx.getImageData(50, 50, 100, 100));
 // ImageData { largeur: 100, hauteur: 100, données: Uint8ClampedArray[40000] }
-
- -

Spécifications

- - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-getimagedata", "CanvasRenderingContext2D.getImageData")}}{{Spec2('HTML WHATWG')}}
- -

Compatibilité des navigateurs

- -

{{Compat("api.CanvasRenderingContext2D.getImageData")}}

- -

Voir aussi

- - +``` + +## Spécifications + +| Spécification | Statut | Commentaire | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------- | ----------- | +| {{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-getimagedata", "CanvasRenderingContext2D.getImageData")}} | {{Spec2('HTML WHATWG')}} | | + +## Compatibilité des navigateurs + +{{Compat("api.CanvasRenderingContext2D.getImageData")}} + +## Voir aussi + +- L'interface le définissant : {{domxref("CanvasRenderingContext2D")}}. +- {{domxref("ImageData")}} +- [Manipulation de pixels avec canvas](/fr/docs/Tutoriel_canvas/Pixel_manipulation_with_canvas) -- cgit v1.2.3-54-g00ecf