Next page | Contents page |

Working with pixels

One more thing that is worth knowing about, even though it may not immediately be applicable, is how to work with individual pixels in the canvas. The ImageData object type has 3 properties: width, height and data. The last of those is a 1-dimensional array of the RGBA bytes for every pixel, so its length is width x height x 4.

The graphics context for our canvas has two useful methods:


	let imData = g2.getImageData(x, y, width, height);
	g2.putImageData(imData, x, y);

As usual MDN has a very useful tutorial covering many more aspects of this.

Next page | Contents page |