在绘制之前预加载地图图块

Question

我正在使用javascript（createJS）和HTML5画布创建一个基于浏览器的游戏......我正在处理tilemap绘图。

我想在绘制之前预先加载所有瓷砖。

function start() {
    stage = new createjs.Stage("demoCanvas");
    stage.mouseMoveOutside = true; 
    if (preloadMap()) {
        log("all loaded");
        createMap();
    }
    else {
        log("error loading tiles");
    }
    ... more stuff


var loadArr = [],
    images = [
        "images/tile.png",
        "images/tile2.png"
    ],
    loadedImages = [];


function preloadMap() {

    for (var i = 0; i < images.length; i++) {
        loadArr[i] = false;
        var img = document.createElement("img");
        loadedImages[i] = img;
        img.src = images[i];
        img.onload = (function(i) {
            return function() { loadArr[i] = true }
        })(i);      
    }
}

如果preloadMap对所有加载图像都返回true，那么我调用createMap()：

function createMap() {
    background = new createjs.Container();      
    for (var y = 0; y < mapArray.length; y++) {
        for (var x = 0; x < mapArray[y].length; x++) {
            if (parseInt(mapArray[y][x]) == 0) {
                var tile = new createjs.Bitmap(loadedImages[0]);
            }
            if (parseInt(mapArray[y][x]) == 1) {
                var tile = new createjs.Bitmap(loadedImages[1]);    
            }
            tile.x = x * 28;
            tile.y = y * 28;
            background.addChild(tile);
        }
    }
    background.cache(0, 0, 1000, 1000); 
    stage.addChild(background);     
}   

获取错误：error loading tiles但不确定原因