圆圈应该相互碰撞，不起作用

Question

我有一个大圆圈和大约 30 个位于大圆圈内的小气泡。小气泡出不了大圆，当一个小气泡遇到另一个小气泡时，它们会偏向相反的方向。

这是两个小圆圈偏转的代码：

var xVelocityBubble1 = Math.random();
var yVelocityBubble1 = Math.random();

var xVelocityBubble2 = Math.random();
var yVelocityBubble2 = Math.random();

moveBubbles = function() {
xbubble1 += xVelocityBubble1;
ybubble1 += yVelocityBubble1;

xbubble2 -= xVelocityBubble2;
xbubble2 -= yVelocityBubble2;

if (Math.sqrt(Math.pow(xbubble1 - xbubble2, 2) + Math.pow(ybubble1 - ybubble2, 2)) < radius * 2) {
xVelocityBubble1 *= -1;
yVelocityBubble1 *= -1;
xVelocityBubble2 *= -1;
yVelocityBubble2 *= -1;
}
}

现在，问题来了。正如你在这张照片上看到的，有时我的气泡会碰撞，我不知道为什么。一切正常，直到一个圈子崩溃，然后突然越来越多的气泡陷入战争。看看圆圈 375、240,330 和 410。首先我认为这可能与不同的速度有关，但这不是问题所在。有人知道吗？

Answer 1

您的代码假设两个圆相撞是因为它们正朝着彼此直线移动，因此碰撞的反应是两个圆朝完全相反的方向移动。

对于几乎朝同一方向移动的圆圈相遇，这种反应会很奇怪。您应该计算圆相交的角度，并据此计算它们交换的动量以及对每个圆的影响。

这可能是因为这种不稳定的反应加上圆圈在一轮计算中发生不止一次碰撞，使它们相互移动。当一个圆在任何碰撞中旋转 180 度时，这意味着如果它碰撞两次（或任何偶数次），它将继续前进，就好像什么都没发生一样。

Answer 2

在我看来，一个半径进入另一个半径，您检测到碰撞，但是在您到达半径之外之前，您再次检测到碰撞并且方向再次以错误的方式反转。一旦一个圆圈在另一个圆圈内，这将导致两个圆圈永远振动。

Answer 3

我认为您需要检查碰撞，当检测到碰撞时，将气泡从碰撞的物体上移开，以免重叠。现在您确实检查了碰撞，但同时允许它们重叠，直到反向速度可以解决这种情况。不应该有重叠。

Answer 4

var xVelocityBubble1 = Math.random();
var yVelocityBubble1 = Math.random();

var xVelocityBubble2 = Math.random();
var yVelocityBubble2 = Math.random();

moveBubbles = function() {
xbubble1 += xVelocityBubble1;
ybubble1 += yVelocityBubble1;

xbubble2 -= xVelocityBubble2;
xbubble2 -= yVelocityBubble2;

if (Math.sqrt(Math.pow(xbubble1 - xbubble2, 2) + Math.pow(ybubble1 - ybubble2, 2)) < radius * 2) {
xbubble1 -= xVelocityBubble1;
ybubble1 -= yVelocityBubble1;
xbubble2 += xVelocityBubble2;
xbubble2 += yVelocityBubble2;

xVelocityBubble1 *= -1;
yVelocityBubble1 *= -1;
xVelocityBubble2 *= -1;
yVelocityBubble2 *= -1;
}
}

您需要撤消导致碰撞的操作，因为这会使气泡处于一种非法状态