Javascript 阻止两个矩形相交

这个小世界包含一个人（蓝色矩形）和一棵树（绿色大矩形）。按键盘上的上、下、左、右键可以控制此人。蓝色矩形仅在按键时移动。蓝色矩形不得脱离地图（即不得脱离灰色区域），也不得与绿色矩形重叠

我知道防止蓝色矩形脱离灰色区域的方法：

if (blueRect.rightEdge >= (canvas.width - 1)) {
    // Don't allow going further to the right
    // But allow going up, down, and to the left
}

// Check the same thing for the other sides of the grey area

我不确定的是如何防止两个矩形相交。

---

在上图中，如何“禁用”右转（以防止交叉路口）？我仍然希望能够上下左右移动。

您正在处理的是所谓的。我不相信有一个简单的答案总是适用的

但是，在您的例子中，因为您有简单的矩形，所以可以检查较小矩形的四个角中是否有任何一个在较大矩形内

---

如果不知道哪个小，哪个大，可以在两个方向上进行检查（即，矩形A的角在矩形B内，然后矩形B的角在矩形A内）。确保使用>=和处理的是调用。我不相信有一个简单的答案总是适用的

但是，在您的例子中，因为您有简单的矩形，所以可以检查较小矩形的四个角中是否有任何一个在较大矩形内

---

如果不知道哪个小，哪个大，可以在两个方向上进行检查（即，矩形A的角在矩形B内，然后矩形B的角在矩形A内）。确保使用>=了解碰撞检测吗？我相信你可以使用你的搜索引擎找到足够的教程和资源choice@UnholySheep问题是大多数教程都教授如何检测交点。我不需要检测交叉口。我需要防止交叉，这叫做“冲突解决”——这是检测到冲突后的下一步。如果要防止交叉，首先需要确定移动对象时是否会发生交叉。了解碰撞检测吗？我相信你可以使用你的搜索引擎找到足够的教程和资源choice@UnholySheep问题是大多数教程都教授如何检测交点。我不需要检测交叉口。我需要防止交叉，这叫做“冲突解决”——这是检测到冲突后的下一步。如果你想阻止一个交叉点，你首先需要确定如果你移动你的物体会发生交叉点。但是你建议的方法不会产生一个交叉点吗？交叉路口的问题是，如果我按下右键并与某物相撞，就无法知道正确的摆脱混乱的方法是按下左键。你想检测请求的移动是否会导致交叉路口。如果是这样，你就不允许基于“碰撞”的移动。别忘了——这不是一个简单的问题。但是你建议的方法不会产生交集吗？交叉路口的问题是，如果我按下右键并与某物相撞，就无法知道正确的摆脱混乱的方法是按下左键。你想检测请求的移动是否会导致交叉路口。如果是这样，你就不允许基于“碰撞”的移动。别忘了——这不是你要处理的一个简单问题。

nextLocation = translate(rectangleA, "up")
if (isIntersecting(rectangleB, nextLocation)) {
    error("collision!")
} else {
    rectangleA = nextLocation
}