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/