JavaScript HTML5 画布碰撞检测

Question

我正在使用 HTML5 画布和 JavaScript 创建类似 air hockey 的游戏。我已经走了很远，但是检测到木槌和球的碰撞让我难过。我尝试使用两个圆之间的距离和距离平方（通过绕过平方根来节省 CPU）。我不知道为什么没有检测到碰撞。

这是我所拥有的：http://austin.99k.org/z_Archive/Air_Hockey/

请看一下并帮我弄清楚。源文件有些注释。

Answer 1

你的命中函数是错误的。您应该简单地计算两点之间的距离（您做对了），并将其与木槌和球之间的最小距离进行比较。

例如，

return distance_squared < radii_squared

你实际上（有效地）在做：

return -COLLIDEDISTANCE < radii_squared - distance_squared && radii_squared - distance_squared < COLLIDEDISTANCE

这要求任何命中都在边缘的 2 个单位内，但我通过 hit() 看到的数字表明您处于使单个单位小于一个像素的比例因子。