Referencia pixels

pixels

Un array que contiene el color de cada píxel en el lienzo.

Los colores se almacenan como números que representan los valores de rojo, verde, azul y alfa (RGBA). pixels es un array unidimensional por razones de rendimiento.

Cada píxel ocupa cuatro elementos en el array pixels, uno para cada valor de RGBA. Por ejemplo, el píxel en las coordenadas (0, 0) almacena sus valores RGBA en pixels[0], pixels[1], pixels[2] y pixels[3], respectivamente. El siguiente píxel en las coordenadas (1, 0) almacena sus valores RGBA en pixels[4], pixels[5], pixels[6] y pixels[7]. Y así sucesivamente. El array pixels para un lienzo de 100×100 tiene 100 × 100 × 4 = 40.000 elementos.

Algunas pantallas utilizan varios píxeles más pequeños para establecer el color en un solo punto. La función pixelDensity() devuelve la densidad de píxeles del lienzo. Las pantallas de alta densidad a menudo tienen una pixelDensity() de 2. En una pantalla así, el array pixels para un lienzo de 100×100 tiene 200 × 200 × 4 = 160.000 elementos.

Acceder a los valores de RGBA para un punto en el lienzo requiere un poco de matemáticas como se muestra a continuación. La función loadPixels() debe ser llamada antes de acceder al array pixels. La función updatePixels() debe ser llamada después de realizar cualquier cambio.

Ejemplos

Notice any errors or typos? Please let us know. Please feel free to edit src/image/pixels.js and open a pull request!

Referencias Relacionadas