Question

我在html5画布上绘制矩形时遇到问题。我正在调用这个函数，没有任何东西出现。我知道它的工作，因为我可以添加一个警报，它工作得很好。任何想法或我只是愚蠢。如果您想查看完整代码，项目位于http://tetris.townsendwebdd.com 谢谢

paintContainer: function(){//doesn't work
    var cont = this.container;
    this.context.fillStyle = cont.color;
    this.context.fillRect(cont.x, cont.y, cont.width, cont.height);
}

paintContainer: function(){//works just fine
            alert('hi');
    var cont = this.container;
    this.context.fillStyle = cont.color;
    this.context.fillRect(cont.x, cont.y, cont.width, cont.height);
}

Answer 1

引用您网站上的代码，这是因为您尝试绘制的填充后面的背景已加载。因此，如果您更改代码：

background.onload = function() {
    context.drawImage(background, 0, 0);
    drawTitle();        
}

var b = new Board(context);

而是在Board：

中绘制onload

background.onload = function() {
    context.drawImage(background, 0, 0);
    drawTitle();    
    var b = new Board(context); 
}

你会得到你想要的效果。我建议你创建一个方法，在onload方法中调用，在资源加载后继续你的游戏。

在html5画布上绘图不是绘画

1 个答案: