如何检测与曲线的碰撞

Question

我正在制作HTML5和Javascript平台游戏。此时，地图的所有块都被视为正方形。当块不是精确的正方形/矩形时，此方法是“丑陋的”。

查看我拍摄的图片，以便更好地理解我的观点：

案例一：“底部保险杠”正在触及包围块的方块，因此运动停止。

案例二：如果我使用与上面相同的方法，当玩家跳跃时，移动将在“顶部保险杠”甚至触及该块之前停止。

我应该如何处理案例二？我知道我必须检查“顶部保险杠”是否在曲线和其他两条边之间的区域内碰撞 OR 。

那曲线怎么样？如何根据块坐标（x，y）和尺寸（宽度，高度）为其生成函数。

注意：我想避免在该曲线的每个点检查碰撞，因为这对CPU来说非常昂贵。

Answer 1

有很多种可能性，取决于你想要碰撞的“完美”程度，以及你想要技术的便携性和劳动密集程度。这不是全面的，这些只是我个人评价的。我亲自使用了前两个。

1. 使用线段来近似曲线。沿曲线创建“顶点”，并从每对曲线中创建线段。你已经知道如何测试轴对齐的正方形，移动到测试以查看你的任何角色点是否在碰撞器线段的“后面”（类似于检查点是否在“飞机后面”）并不是一个巨大的飞跃。您可以使用此结果获得令人惊讶的准确和高效的结果（取决于您生成线段的粒度），最难的部分是首先生成碰撞图。我选择手工定义片段，我认为这是一个错误。如果我再次这样做，我可能会尝试找到一种生成线段的方法，给出一些关于我想要它们的粒度的设置。

2. 计算曲线的轮廓，并为曲线的每个像素创建1px乘以1px的碰撞器。这是你的碰撞图。使用圆或省略号作为角色的碰撞网格，并检查碰撞者和角色之间的距离。这大大简化了计算，虽然我们讨论的是可能计算的 lot （每个像素一次检查），但是通过积极空间划分你的世界可以进行大量的优化（bin， bsp，无论如何）。生成这是相对简单的图像边缘检测，因此您最终可以使用近乎直观的解决方案。我在Spy Hunter ripoff中使用了这个，艺术家非常欣赏能够制作艺术而不用担心碰撞的能力。

3. 像素差异。我从来没有真正这样做过，但我已经看过了 “pdiffing”，其中字符精灵和瓷砖精灵被重叠 在内存中，如果非透明区域之间有任何重叠 两者之一，表示发生碰撞。取决于你的大小 精灵，这可能会变得非常昂贵。它也会 可能只适用于基于图块的游戏。