您好，我有以下 Canvas 应用程序:http://dev.driz.co.uk/canvas/
正如您将看到的，它渲染了一堆球。我遇到的问题是当应用程序首次启动时，球被 Canvas 边缘切断。他们不应该这样做，如果他们触摸它，他们应该从 Canvas 边缘弹开!
我很难理清物理原理，如果您移动鼠标它们会反弹，但如果在启动时则不会。
谢谢
最佳答案
您可以检查一下，如果有任何球被切断(它伸出墙外)，则只需将其重新定位在墙上，或者将球沿它应该移动的方向移动到离墙很远的地方。
因此，如果球距离墙 3 个像素，那么您可以将它定位在距离墙 3 个像素的新方向上。
这会有所帮助，因为如果您的时间段太短，并且球移动得太快，您可以修复它。
更新:
查看您的代码后，出于某种原因我看不到它在 Chrome 中移动，也没有在 Firefox 4b7 上绘制，但是通过查看您的代码，这一行可能是一个问题:
Balls[i].x += Balls[i].vx;
如果x + vx < 0那么它仍然会在墙的左边。
它可以关闭的原因是你有这个代码:Balls[i].vx *= 0.99; , 将继续减少 vx在你做检查之前。在进行调整后，您可能希望将其放在最后。
此外，您在同一个 if 语句 block 中同时拥有左右墙的代码，我希望它们应该分开处理。
要解决此问题，最好的办法是使用 Firebug，在 Firefox 上，用一个球，当它越过一堵墙时放置一个 break 语句，然后查看每个步骤中的值是什么。
当您调整时，您还假设球沿直线运动，因为您只在一个方向上进行校正，具体取决于哪个方向 if声明失败，尽管在 Angular 落的情况下，两者都失败是可能的。那是你的物理模型的失败，如果我以 45 度 Angular 前进并且撞到了墙，我应该以 45 度 Angular 反弹，例如，如果墙是理想的。
学习使用调试器，Chrome、IE 和 Firefox 都有不错的调试器，但我倾向于使用 Firebug，也许是因为使用它的经验。
关于javascript - HTML5 Canvas 物理，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/4300100/