ctx.drawImage不起作用

时间:2012-03-31 14:46:29

标签: javascript html5

我正在制作游戏。下面应该给我画一张c.png(一枚硬币)的图片,但它不起作用。

以下链接有一个例子: http://jonirautiainen.net/html5peli/testi.html

<div id="game"></div><script>
var canvasWidth = window.innerWidth - 20;
var canvasHeight = window.innerHeight - 100;
var game = document.getElementById("game");
game.innerHTML = '<canvas id="canvas" width="' + canvasWidth + '"height="' + canvasHeight + '"style="border:solid black 1px"></canvas>';

var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
var cimg = new Image();
//coin
cimg.src = "c.png";
var time = 0;
var delay = 0;
var coin = {
        srcX: 0,
        srcY: 0,
        w: 90,
        h: 89,
        dw: 40,
        dw: 40,
        x: Math.floor(Math.random() * canvasWidth),
        y: Math.floor(Math.random() * canvasHeight) 
}
ctx.drawImage(cimg, coin.srcX, coin.srcY, coin.w, coin.h, coin.x, coin.y, coin.dw, coin.dh);



</script>

有什么想法吗?它没有给我任何错误。

感谢。

1 个答案:

答案 0 :(得分:1)

您已在此处输入dw两次:

var coin = {
        srcX: 0,
        srcY: 0,
        w: 90,
        h: 89,
        dw: 40,
        dw: 40,
        x: Math.floor(Math.random() * canvasWidth),
        y: Math.floor(Math.random() * canvasHeight) 
};

第二个应该是dh: 40。 =)

相关问题