O'Reilly logo

HTML5 Game Development by Example : Beginner's Guide - Second Edition by Makzan

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Time for action – adding graphics to the game

We are going to draw a blackboard background to the game:

  1. Download the graphics files from the code example bundle or the following URL: http://mak.la/book-assets. The graphics files include all the graphics that we need in this chapter.
  2. Put the newly downloaded graphics files into a folder named images.
  3. Now it is time to really load the image. There is a board.png file in the graphics file we just downloaded. It is a blackboard graphic that we will draw in the Canvas as a background. Add the following code after the code we just added in the previous step:
    untangleGame.loadImages = function() { // load the background image untangleGame.background = new Image(); untangleGame.background.onerror = function() ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required