Manipulate RGBA Javascript

问题:

In Javascript i have a Uint8Array() RGBA of image, here is console.log of this :

Here is image with rgba array as a string in HTML:

Is that possible to manipulate this array, to ex. change colors? Thanks for help!

回答1:

Here's a JS algorithm of plotting a pixel to this kind of array:

function changeColor(x, y, c)
{
   colorArray[(x * 4) + (y * (imageWidth * 4))] = c.r;
   colorArray[(x * 4) + (y * (imageWidth * 4)) + 1] = c.g;
   colorArray[(x * 4) + (y * (imageWidth * 4)) + 2] = c.b;
   colorArray[(x * 4) + (y * (imageWidth * 4)) + 3] = c.a;
}

where x and y are the coordinates of the pixel you want to change, imageWidth being the width of the image this array produces, c being the colour you want to change the pixel to, and colorArray is the array itself.