Random Pixels

The end result

This took me far too long, but in my defence it was a long day of regression testing at work: a node.js endpoint which generates a random pixelated image.

The code is reasonably simple: generate a backing 2d array of random values where the probability of there being a pixel is reduced each row. So P(pixel|row(0))=1.0, P(pixel|row(n))=0.0 where n is the number of rows and P(pixel|row(x))=x/n where x is any row between 0 and n.

The image is then generated, with the usual process of putting 2d coordinates in a single dimension array, with the added fun that each pixel has to take up 4 items in the array (rgba). Thus for any point (x, y) the starting index is (x + y * width) * 4.

I still have to improve the drop shadow code as it's hacky and buggy, my original thought was to check the alpha of the neighbouring pixels, but I did this in a dumb way and it needs a complete rewrite. Especially the wrapping code.

All in all it was a fun little piece of computer vision programming which takes my website rewrite beyond the default bootstrap theme (oh yeah, I rewrote my main website and used Let's Encrypt everywhere).

Update:

Generation of the drop shadow is now there. It uses the backing array rather than the image data, as well as generating offsets and summing then with the current location.