5.5. Creating an image from scratch

The last section was pretty dense, but it will be worth it as you can now move onto the really cool stuff, like creating pixels from thin air to make your very own images.

To create pixels you need to call the createImageData method of the 2d rendering context. By passing the method a width and height, you'll get returned an ImageData object with all the usual attributes: width, height, and most important, data. The CanvasPixelArray contained in the data attribute holds your new pixels, which are invisible at the moment as they're all set to a transparent black color.