From 1109132f09d75da9a28b649c7677bb6ce07c40c0 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:45 -0500 Subject: initial commit --- .../getimagedata/index.html | 103 +++++++++++++++++++++ 1 file changed, 103 insertions(+) create mode 100644 files/es/web/api/canvasrenderingcontext2d/getimagedata/index.html (limited to 'files/es/web/api/canvasrenderingcontext2d/getimagedata/index.html') diff --git a/files/es/web/api/canvasrenderingcontext2d/getimagedata/index.html b/files/es/web/api/canvasrenderingcontext2d/getimagedata/index.html new file mode 100644 index 0000000000..4f0c72afd0 --- /dev/null +++ b/files/es/web/api/canvasrenderingcontext2d/getimagedata/index.html @@ -0,0 +1,103 @@ +--- +title: CanvasRenderingContext2D.getImageData() +slug: Web/API/CanvasRenderingContext2D/getImageData +tags: + - CanvasRenderingContext2D + - Context 2D + - Español + - Method + - Reference + - getImageData +translation_of: Web/API/CanvasRenderingContext2D/getImageData +--- +
{{APIRef}}
+ +

 

+ +

El método CanvasRenderingContext2D.getImageData() de la API de Canvas 2D devuelve un objeto ImageData que representa los datos de píxeles subyacentes para el área del lienzo denotada por el rectángulo que comienza en (sx, sy) y tiene un ancho de sw y una altura de sh. Este método no se ve afectado por la matriz de transformación de la lona.

+ +

Los píxeles fuera del área del lienzo están presentes como valores negros transparentes en los datos de imagen devueltos.

+ +

 

+ +

Sintaxis

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

Parámetros

+ +
+
sx
+
La coordenada 'x' de la esquina superior izquierda del rectángulo del que se extraerán los datos de imagen.
+
sy
+
La coordenada 'y' de la esquina superior izquierda del rectángulo del que se extraerá el ImageData.
+
sw
+
El ancho del rectángulo del que se extraerán los datos de la imagen.
+
sh
+
La altura del rectángulo del que se extraerán los datos de la imagen.
+
+ +

Valor de retorno

+ +

An ImageData object containing the image data for the given rectangle of the canvas.

+ +

Errores cometidos

+ +
+
IndexSizeError
+
Lanzado si cualquiera de los argumentos de anchura o altura es cero.
+
+ +

Ejemplos

+ +

Usando el método getImageData

+ +

Esto es sólo un simple fragmento de código que utiliza el método getImageData. Para obtener más información, consulte Manipulación de píxeles con Canvas y el objeto 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 { width: 100, height: 100, data: Uint8ClampedArray[40000] }
+
+ +

Especificaciones

+ + + + + + + + + + + + + + +
EspecificaciónEstadoComentario
{{SpecName('HTML WHATWG', "scripting.html#dom-context-2d-getimagedata", "CanvasRenderingContext2D.getImageData")}}{{Spec2('HTML WHATWG')}} 
+ +

Compatibilidad con navegadores

+ + + +

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

+ +

Véase también

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