Javascript 处理平台中两个矩形的相交

我正在用HTML5/Canvas/Javascript/jQuery开发一个简单的平台游戏。你可以看到

我知道如何检查两个矩形的交点（这里有几个关于这方面的问题），我的游戏检查并处理两个矩形的交点，但只有在非常特定的情况下，并且仅仅因为角色不比我的区块宽

我的问题是：如何计算两个矩形的交点，以判断交点从哪个方向发生？我能想到的唯一方法包括20多条if语句（这不是正确的方法吗？）

---

我需要知道相交的方向，因为我向前“窥视”看我的精灵坐标（x+dx，y+dy）是否会与矩形相交，如果会，请在下一个刻度上将精灵的新坐标设置为矩形的边缘。

要获得矩形相对于其他矩形的位置，您可以使用精灵矩形的中心，并获得其在块中的位置。
以下函数用于获取点到另一点的位置。它应该对你有帮助。只需调整以使用精灵中心和块中心验证精灵在块中的位置（或验证精灵中心在块左上角和右下角的位置）

---

编辑：当考虑到x轴和y轴原点位于视口的左上角时，所有这些都很好

我是否理解得很好：你想知道第二个（你的角色）在最宽矩形的哪一侧（西南-东北）相交？你能解释一下“相交方向”是什么意思吗？我想你的意思是你想检测精灵和矩形之间的碰撞，你需要知道碰撞（或即将发生的碰撞）时精灵在矩形的哪一侧。对，你们两个都是。对不起，如果我有点难以理解。。。问题是，我可以知道我的角色何时会在下一个刻度上与矩形相交，但我真的不知道如何处理这个问题（或者，如何根据角色的当前位置确定角色的放置位置）。很好，这正是我需要的！现在，我可以使用此函数进行交叉点检查并确定新位置。

function positionOf(point, relativeTo) {
    var dx = point.x - relativeTo.x; // diff on x axis
    var dy = point.y - relativeTo.y; // diff on y axis

    if(dx >= dy) { // point is on top right half from relativeTo
             return dx >= - dy ? 'EAST' : 'NORTH';
    }
    else { // point is on bottom left half from relativeTo
             return dx >= - dy ? 'SOUTH' : 'WEST';
    }
}