问题标签 [separating-axis-theorem]

我已经实现了分离轴定理来管理平移和旋转矩形碰撞检测和响应（响应的物理特性可能不是很准确，但没关系，我现在已经足够好了）。但是，当两个矩形重叠时，或者当一个矩形卡在画布边缘时，我很难管理： 就像在这个 gif 上一样

如果有人开始解释如何做，或者可以引导我寻找有用的资源。我将不胜感激。

这里是代码的链接，如果你想一睹为快：https ://jsixj.csb.app/

编辑：不是没有检测到碰撞，而是为时已晚：碰撞检测触发较晚，因此两个矩形“深度纠缠”，碰撞响应将速度矢量更改为相反方向，然后，下一个帧，检测到碰撞，因为两个矩形没有时间相互“分离”，等等。换句话说：在每个更新（requestAnimationFrame）中，检测到碰撞并且速度矢量相应地改变为相反的方向，但由于矩形还深度重叠，它们没有时间分开。

这个问题很好解决，在圈子的情况下很容易解决： 伪代码：

矩形肯定更棘手，特别是在旋转时，因为我认为，我们必须考虑矩形的方向来解决问题我正在寻找解决这个问题的一般哲学的线索，但如果你需要挖掘我写的代码有点，请参考上面的链接

编辑：为了更好地理解我在上面试图解释的内容是另一个 gif 来说明：

我将速度向量建模为绿色，然后你可以看到当矩形卡住时会发生什么，碰撞检测太快改变了每一帧的速度方向，因此避免了矩形“逃离”边缘。

我在如何实施 SAT 上处于停滞状态。我完全理解它的概念并观看/阅读了许多教程，但不幸的是，我发现的所有内容要么使用库，要么使用不同的语言。我一直无法将其转换为纯 js。

到目前为止，我有我的旋转对象，我正在跟踪updateCorners()我的 Square 类中的角。我已经使用函数为两个矩形创建了向量。我有一个用于点积的功能并将其标准化。我启动了一个函数来完成检查每个角与每个矩形的 x 和 y 向量的大部分工作，但只是不知道该去哪里。

有人会在这里写一些代码吗？我真的很感激。