Core HTML5 Canvas: Graphics, Animation, and Game Development

Chapter 8. Collision Detection

Collision detection, in one form or another, is a staple of many animations and nearly all games. In this chapter you will see how to implement collision detection, from simple strategies involving bounding areas and intersecting rays, to detecting collisions between arbitrary polygons, circles, images, and sprites.

Most of this chapter deals with implementing the separating axis theorem (SAT), which is a highly accurate and widely used method for detecting collisions between polygons, both in two and three dimensions. You will see how to implement the SAT with Canvas, and how to extend it for circles, images, and sprites.

This chapter concludes with a look at a byproduct of the SAT, the minimum translation vector ...