Virtually any 3D computer graphics application needs to provide mechanisms for the user to interact with the scene being displayed on the screen. For instance, you are writing a game you want to point at your target and perform an action upon it. Similarly, if you are writing a CAD system, you want to be able to select an object in your scene to modify its properties. In this chapter, we will see the basis of implementing these kinds of interactions in WebGL.
We could select objects by casting a ray (vector) from the camera position (also known as eye position) into the scene and calculate what objects lie along the ray path. This is known as ray casting and it involves detecting intersections between the ray and object surfaces in the scene. However, because of its complexity it is beyond the scope of this beginner's guide. Instead, we will use picking based on object colors. This method is easier to implement and it is a good starting point to help you understand how picking works...