WebGL Beginner's Guide

Reading pixels from the offscreen framebuffer

We can go now to the offscreen buffer and read the color from the coordinates that we clicked on the canvas.

WebGL allows us to read back from a framebuffer using the readPixels function. As usual, having gl as the WebGL context variable:

Function	Description
gl.readPixels(x, y, width, height, format, type, pixels)	x and y: Starting coordinates. width, height: The extent of pixels to read from the framebuffer. In our example we are just reading one pixel (where the user clicks) so this will be 1,1. format: At the time of writing this book the only supported format is gl.RGBA. type: At the time ...