HTML and CSS Reference
In-Depth Information
, [32,31,31,31,1,31,31,31,31,32]
function eventSheetLoaded() {
function drawScreen() {
for (var rowCtr=0;rowCtr<mapRows;rowCtr++) {
for (var colCtr=0;colCtr<mapCols;colCtr++){
var tileId = tileMap[rowCtr][colCtr]+mapIndexOffset;
var sourceX = Math.floor(tileId % 8) *32;
var sourceY = Math.floor(tileId / 8) *32;
context.drawImage(tileSheet, sourceX,
Figure 4-10. The tile map painted on the canvas
Next, we are going to leave the world of tile-based Canvas development (see Chap-
ter 9 for an example of a small game developed with these principles). The final section
of this chapter discusses building our own simple tile map editor. But before we get
there, let's look at panning around and zooming in and out of an image.
Search WWH ::

Custom Search