HTML and CSS Reference
In-Depth Information
Third, Paint the Tile-Based World to the Canvas
Our world is built using a 15x15 grid. Figure 9-13 shows the entire world we will use in our
scrolling examples.
Figure 9-13. A 15×15 tile map
For the scrolling examples, we use a canvas that is smaller than the world. We are using a
small canvas (160×160) and a small world (480×480) simply to make sure that the code is
easily understood in topic form. In a real-world example, the tile-based world might be 100+
tiles in each dimension, drawn onto a canvas that is 640×480. Here is the HTML5 Canvas ob-
ject we will be using:
< canvas id = "canvas" width = "160" height = "160" >
Search WWH ::

Custom Search