html5画布对象碰撞和物理

时间:2012-07-04 20:43:37

标签: javascript html5 html5-canvas game-physics collision

我正在制作一个简单的html5平台游戏,构建以前的游戏,但遇到了碰撞和物理问题。下面是关于地板及其如何处理碰撞的代码示例。完整的代码在这里。 http://www.ambitiongames.co.uk/dev/game.php游戏在这里http://www.ambitiongames.co.uk/dev/

我遇到的问题是碰撞是基于事件的抓取,有时会让玩家不在地板上。

另外,由于跳跃和下降的工作方式,没有重力,这意味着玩家可以简单地跳上更高的壁架,然后走向空中。

什么是建立永久重力的好方法?

什么是与地板或其他物体互动/碰撞的好方法?

        that.draw = function(){  
            try {  
                ctx.drawImage(that.image, that.x, that.y, that.width, that.height);  
                } catch (e) {  
                }  
        } 
        return that;  
    };

    var nrOffloors = 40,   
        floors = [],  
        floorWidth = 20,  
        floorHeight = 40;  
        var generatefloor = function(){  

            for (var i = 0; i < 10; i++) {  
                floors[i] = new Floor(i * 20,280);   
            } 
            for (var i = 10; i < 12; i++) {  
                floors[i] = new Floor(i * 20,260);   
            } 
        }();

    var checkCollisionfloor = function(){  
        floors.forEach(function(e, ind){  
            if (   
                (player.X < e.x + floorWidth) &&   
                (player.X + player.width > e.x) &&   
                (player.Y + player.height > e.y) &&   
                (player.Y + player.height < e.y + floorHeight)  

                ) {  
                    e.onCollide();  
                } 
        });     
    } 

1 个答案:

答案 0 :(得分:1)

您可以尝试像Box2D.js这样的库。它处理从碰撞检测到重力的所有事情。

查看它的演示。