Javascript HTML5+;JS:可旋转角色的碰撞检测

Javascript HTML5+;JS:可旋转角色的碰撞检测,javascript,html,rotation,transform,collision,Javascript,Html,Rotation,Transform,Collision,我正在为我的游戏设计碰撞系统;这是一个自上而下的射手,角色总是静止的,其他一切(地图/关卡)都在他周围移动 角色也会旋转,因此它始终面向鼠标位置 考虑到这一点,我的头似乎无法绕过碰撞系统,碰撞系统需要考虑角色旋转,对吗 我基本上只想检查给定的对象是否“接触”我的角色/精灵。我不太确定我用的数学是否正确 这是我的碰撞检测(称为每次更新): 如果有人在这里帮助我,我将不胜感激:)谢谢 就我个人而言,我不会太担心角色冲突。我这样说的原因很简单 让我们看看你走得离墙很近。然后你转向跟随鼠标,然后精灵与墙

我正在为我的游戏设计碰撞系统;这是一个自上而下的射手,角色总是静止的,其他一切(地图/关卡)都在他周围移动

角色也会旋转,因此它始终面向鼠标位置

考虑到这一点,我的头似乎无法绕过碰撞系统,碰撞系统需要考虑角色旋转,对吗

我基本上只想检查给定的对象是否“接触”我的角色/精灵。我不太确定我用的数学是否正确

这是我的碰撞检测(称为每次更新):


如果有人在这里帮助我,我将不胜感激:)谢谢

就我个人而言,我不会太担心角色冲突。我这样说的原因很简单

让我们看看你走得离墙很近。然后你转向跟随鼠标,然后精灵与墙重叠。你现在做什么?要么你停止旋转,这会使动作混乱,要么你让精灵重叠,玩家被完全卡住,直到他们再次自由旋转


我更喜欢使用碰撞圆。如果玩家离墙的距离小于R像素,则将其视为碰撞并阻止玩家移动。这样,即使玩家转身,精灵也不会让玩家被卡住,他将永远能够离开墙壁。

这次我进入了ludum dare,并做了一个教程来解释我的基本代码。教程可在此处找到:

这演示了一个基于圆的碰撞检测示例-请随意使用任何代码。以下代码是对该代码的改编,用于一般用途:

function CollisionCheck(obj1,obj2){
    // If the two objects are less the sum of their collision radii apart then they have collided
    // Note that one obj is obj (with a loc and a size) and the other is this.
    // Returns true if the objects are touching

    var dist = obj2.size + obj1.size; // The distance they must be apart to be not touching
    if(obj1.x-obj2.x>dist || obj1.x-obj2.x<-dist)
       return false; // Too far apart in x plane
    if(obj1.y-obj2.y>dist || obj1.y-obj2.y<-dist)
       return false; // Too far apart in y plane

    var xDist = obj1.x-obj2.x;
    var yDist = obj1.y-obj2.y;

   var hyp = Math.sqrt((xDist*xDist)+(yDist*yDist));

   if(hyp<dist)
    return true;

   return false;

}
功能冲突检查(obj1、obj2){
//如果两个对象的距离小于其碰撞半径之和,则它们发生碰撞
//请注意,一个obj是obj(带有loc和尺寸),另一个是此。
//如果对象正在接触,则返回true
var dist=obj2.size+obj1.size;//它们必须分开才能不接触的距离

如果(obj1.x-obj2.x>dist | | | obj1.x-obj2.xdist | | obj1.y-obj2.yDo是否需要使用矩形?如果不需要,您可以通过计算两个中心点之间的距离并将其与半径进行比较来执行基于圆的碰撞检测。精灵是矩形,测试道具也是如此……现在这是一个可能的重复:这是一个好主意-好吗是的,谢谢@Kolink。你会怎么做呢?它有一个特殊的术语吗?圆形字符碰撞?它应该很简单。看看你的精灵的中心点,检查它和墙之间的最短距离是否不小于你的圆半径(否则你会发生碰撞)。函数碰撞(obj1,obj2){var x=obj1.x-obj2.x,y=obj1.y-obj2.y;返回Math.sqrt(xx+yy)ctxMap.setTransform(1, 0, 0, 1, -Map.x + gameWidth/2, -Map.y + gameHeight/2);
function CollisionCheck(obj1,obj2){
    // If the two objects are less the sum of their collision radii apart then they have collided
    // Note that one obj is obj (with a loc and a size) and the other is this.
    // Returns true if the objects are touching

    var dist = obj2.size + obj1.size; // The distance they must be apart to be not touching
    if(obj1.x-obj2.x>dist || obj1.x-obj2.x<-dist)
       return false; // Too far apart in x plane
    if(obj1.y-obj2.y>dist || obj1.y-obj2.y<-dist)
       return false; // Too far apart in y plane

    var xDist = obj1.x-obj2.x;
    var yDist = obj1.y-obj2.y;

   var hyp = Math.sqrt((xDist*xDist)+(yDist*yDist));

   if(hyp<dist)
    return true;

   return false;

}