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 ...

Get HTML5 Game Development by Example : Beginner's Guide - Second 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.