HTML5 Game Development by Example(Second Edition)

Summary

You learned a lot in this chapter about drawing gradients, text, and images in a Canvas. Specifically, we built the Untangle game logic and used several advanced Canvas techniques, including sprite sheet animation using the clipping function when drawing images. We divided the game into several layers by stacking several canvas elements. This allows us to handle different parts of the game rendering in separated and specific logic. Finally, we mixed the CSS transition animation in a Canvas-based game.

One thing we haven't mentioned in this book is the bitmap manipulation in Canvas. Canvas context is a bitmap data where we can apply an operation on each pixel. For instance, we may draw an image in the Canvas and apply Photoshop-like filters ...