在Javascript中显示图块地图

Question

这是我现在正在使用的代码，试图生成一个tilemap：// --- Javascript ---window.onload = function (){  var can = document.getElementById("canvas");  var ctx = can.getContext('2d');  var map = {  cols: 8, //# of cols  rows: 8, // # of rows  tSize: 32, // tile size (32px x 32px)  tiles: [    [1, 1, 1, 1 ,1 ,1, 1, 1],    [1, 1, 1, 1, 1, 1, 1, 1],    [1, 1, 1, 1, 1, 1, 1, 1],    [1, 1, 1, 1, 1, 1, 1, 1],    [1, 1, 1, 1, 1, 1, 1, 1],    [1, 1, 1, 1, 1, 1, 1, 1],    [1, 1, 1, 1, 1, 1, 1, 1],    [1, 1, 1, 1, 1, 1, 1, 1]  ], // map};var tileAtlas = new Image();tileAtlas.src = 'Tiles.png';tileAtlas.onload = function () {  for (var c = 0; c < map.cols; c++) {    for (var r = 0; r < map.rows; r++) {      if (map.tiles[c][r] !== 0) { // 0 is an empty tile        ctx.drawImage(          tileAtlas, // image          map.tiles[c][r] * 32, // cut start x          0, // cut start y          map.tsize, // size of tiles for cut size x          map.tsize, // size of tiles for cut size y          c * map.tsize, // place tiles on canvas x          r * map.tsize, // place tiles on canvas y          map.tsize, // place height          map.tsize // place width        );      }    }  }}}这是spritesheet本来应该显示一个8x8的“草”网格，但它是空白的，但控制台却很清晰