Question

I have a problem with drawing images to my canvas. There is no error but still there is no images drawn. Please review the chunk of code and see if you can see what I cannot:

function loadPacman(posX, posY) {
    this.posX = posX;
    this.posY = posY;
    pacman = new Image();
    pacman.src="http://www.frogbug.se/pacman/img/naziman.png";
    pacman.addEventListener("load", function(){
            canvas.drawImage(pacman, this.posX, this.posY)
        }, false);
}

function loadGhost(posX, posY) {
    this.posX = posX;
    this.posY = posY;
    ghost = new Image();
    ghost.src="http://www.frogbug.se/pacman/img/ghost.png";
    ghost.addEventListener("load", function(){
            canvas.drawImage(ghost, this.posX, this.posY)
        }, false);
}

这也是我的职责,即当页负荷时装上:

function onLoad() {
    var xy = document.getElementById( canvas );
    canvas = xy.getContext( 2d );
    //calculate the x and y for canvas
    x = xy.width;
    y = xy.height;

    //divide the width and length of the canvas to get small cubes
    //which is 40x40
    xtile = Math.floor(x/40);
    ytile = Math.floor(y/40);

    //draw lines around the canvas
    canvas.strokeRect(0, 0, x, y);

    //the array for the map
    var map = getMapArray();

    //draw the map
    drawMap(map);
    //fillCanvas("0010", 0, 40, 40, 40);

    //load the ghost and pacman
    loadPacman(0, 0);
    loadGhost((xtile*40)-40, (ytile*40)-40);
}

Thanks in advance! You can view the full source and so on here: http://www.picturds.com/pacman_serious/

Answer 1

Remove this from this.posX and this.posY in theload callsback. http://www.un.org/Depts/DGACM/index_chinese.htm (window)。

http://jsfiddle.net/5dkx4/。

友情链接