From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../getimagedata/index.html | 103 +++++++++++++++++++++ 1 file changed, 103 insertions(+) create mode 100644 files/fr/web/api/canvasrenderingcontext2d/getimagedata/index.html (limited to 'files/fr/web/api/canvasrenderingcontext2d/getimagedata') diff --git a/files/fr/web/api/canvasrenderingcontext2d/getimagedata/index.html b/files/fr/web/api/canvasrenderingcontext2d/getimagedata/index.html new file mode 100644 index 0000000000..719eb385dc --- /dev/null +++ b/files/fr/web/api/canvasrenderingcontext2d/getimagedata/index.html @@ -0,0 +1,103 @@ +--- +title: CanvasRenderingContext2D.getImageData() +slug: Web/API/CanvasRenderingContext2D/getImageData +tags: + - API + - Canvas + - Canvas API + - CanvasRenderingContext2D + - Image + - ImageData + - Méthode + - Méthodes + - References + - getImageDate +translation_of: Web/API/CanvasRenderingContext2D/getImageData +--- +
{{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.

+ +

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

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

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.
+
+ +

Valeur retournée

+ +

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

+ +

Erreurs renvoyées

+ +
+
IndexSizeError
+
Renvoyé si l'un des arguments de  largeur ou de hauteur est égal à zéro.
+
+ +

Exemples

+ +

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")}}.

+ +

HTML

+ +
<canvas id="canvas"></canvas>
+
+ +

JavaScript

+ +
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

+ + -- cgit v1.2.3-54-g00ecf