Box2D and the Canvas

Now that we have discussed how to use math and physics to create animations on the Canvas, it’s time to take this discussion to the next level and implement a popular JavaScript library named Box2D. Box2D is a physics modeling library for 2D graphics. We will use it to replace some of the complex code we developed manually for some of the earlier examples in this chapter.

Box2D was originally developed for C++ by Erin Catto and gained popularity as a library named Box2DFlashAS3 for making Flash games in ActionScript 3. There are two Box2D implementations for JavaScript. The first is Box2Djs, and the other is Box2dWeb. Box2dWeb is the latest and greatest and had has been updated to Box2D 2.1, so that is the version we will use in our examples. Box2dWeb was ported directly from ActionScript 3 for use on the HTML5 Canvas.

Get HTML5 Canvas, 2nd Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.