WebGL Beginner's Guide

Looking for hits

We are going to check now whether or not the color that was obtained from the off-screen framebuffer corresponds to any of the objects in the scene. Remember here that we are using colors as object labels. If the color matches one of the objects then we call it a hit. If it does not we call it a miss.

When looking for hits, we compare each object's diffuse color with the label obtained from the offscreen framebuffer. There is a consideration to make here: each color channel of the label is in the [0,255] range while the object diffuse colors are in the [0,1] range. So, we need to consider this before we can actually check for any possible hits. We do this in the compare function:

function compare(readout, color){ return (Math.abs(Math.round(color[0]*255) ...