1. Technology

Core HTML5 CANVAS

by David Geary

About.com Rating 5 Star Rating

By

Core HTML5 Canvas by David Geary

Core HTML5 Canvas by David Geary

Image courtesy PriceGrabber

Bottom Line

This is a very comprehensive look at one of the trickier parts of HTML5: CANVAS. Because of the subject matter, this book is not suited to beginners, but if you have a familiarity with JavaScript and some HTML, and you want to learn how to draw on your web pages, you'll find this book has all you need.

The full color illustrations, code samples, and text makes the book very easy to read. And the author spent a lot of time on code and examples to show you what you're learning, not just tell you. There is hardly any page of the book that doesn't have some HTML or image rather than bland text. If you want to learn how to use HTML5 CANVAS especially for game development, you won't be sorry if you get this book.

Pros

  • Full color
  • Very strong introductory chapters
  • Good coverage of nearly everything you'd want to do with a CANVAS element

Cons

  • The first few chapters are extremely long, compared to the end chapters

Description

  • Publisher: Prentice Hall
  • Price: $49.99
  • Length: 723 pages
  • Released: May 2012
  • Chapter 1 covers the basics of building and using an HTML5 CANVAS element. It includes things like context, browser support, basic drawing, event handling, using other HTML elements in the CANVAS, and using CSS to not display CANVAS elements while still using the data in them.
  • Chapter 2 covers drawing on CANVAS. It explains how the coordinates work, and gets you started drawing rectangles, adding colors, gradients, patterns, and shadows. Plus you'll learn to stroke and fill shapes and paths or lines, create circles and arcs, and polygons. It even goes into more advanced drawing techniques covering transformations, compositing, and clipping.
  • Chapter 3 explores using text on CANVAS elements. You'll learn the basics of filling and stroking text, other font properties, how to position your text, and then controlling the text on the CANVAS.
  • Chapter 4 moves into images and video. You'll learn how to draw and manipulate images on your CANVAS, clip and animate images, and even learn about performance benefits and drawbacks to using CANVAS. There is also some information about playing video in your CANVAS as well as converting formats and proceessing the videos.
  • Chapter 5 is where it starts getting really fun. You'll learn how to create animations in CANVAS.
  • Chapter 6 covers sprites. Sprites are what make it possible to create games that are efficient to load but still have lots of graphics and moving animated elements.
  • Chapter 7 talks about gravity which is another important part of game development.
  • Chapter 8 helps you learn collision detection.
  • Then in Chapter 9 you'll learn to put the preceding chapters all together to create a game on your CANVAS. There are two games you'll learn to build including “The Ungame” that will help you understand how to use the game engine to create games.
  • Chapter 10 covers custom controls like rounded rectangles, progress bars, and sliders.
  • Chapter 11 brings in mobile. You'll learn how to deal with the viewport and how to use media queries. It even covers touch events so your CANVAS supports touch screens better.

Jennifer Kyrnin’s Review of Core HTML5 CANVAS

There is a lot to read in this book, but that is not surprising because there is a lot to know about HTML5 CANVAS. I learned more about CANVAS from this book than I have from any other single source. It's easy to skim to find what you want to know and the full-color images and text makes it easy to understand as well.

One thing I love is that the author even explains the cannoical form of the examples so that you don't have to guess. He shows you the full basic HTML that he is using for his examples, and then explains which parts will be left out in most examples to keep the book shorter. This is how most HTML and JavaScript books handle code, but very few spell it out so clearly.

The first 3-4 chapters of the book are extremely long, but if you read through it all you will have a very strong understanding of all the basic things that the CANVAS element can do and how to do them. And what's nice is that because they are long, these chapters are also very comprehensive. Chapter 2 even goes into how to solve algebraic equations for transformations. I don't think I've ever seen a book on CANVAS cover that.

The game development chapters (chapters 6-9, primarily) are really helpful for understanding how game development works as well as putting it together in an HTML5 CANVAS. Understanding sprites, gravity, and collision detection is fundamental to game development.

The mobile chapter is a bit light, which isn't surprising as it's at the end. I'd rather have seen these mobile elements included as part of the introductory chapters to help developers recognize that they should be considering mobile alongside desktop when doing development. But that is my bias. The reality is that the information he covers in the mobile chapter has had complete books devoted to it. So, don't assume you'll be set for mobile game development after reading that one chapter. But it's a good start.

Overall I like this book. It's comprehensive and easy to follow. It covers a complex topic with a lot of information, code samples, and even sample games you can build.

Disclosure: A review copy was provided by the publisher. For more information, please see our Ethics Policy.

©2014 About.com. All rights reserved.