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

时间:2012-10-16 16:02:25

标签: javascript canvas geometry square-root

我有一个大圆圈,大约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;
}
}

Bubbles inside a big Circle

现在,这是问题所在。正如你在这张照片上看到的那样,有时候我的气泡会碰撞,我不知道为什么。一切正常,直到一个圆圈崩溃,然后突然间越来越多的气泡在战争中。看看圈子375,240,330和410.首先我认为这可能与不同的速度有关,但这不是问题。有谁有任何想法?

4 个答案:

答案 0 :(得分:1)

你的代码假设圆圈相互碰撞,因为它们是直接相互移动的,因此碰撞的反应就是两个圆圈的方向恰好相反。

对于几乎朝同一方向移动的圈子来说,这种反应会很奇怪。你应该计算圆圈相交的角度,并从中计算它们交换的动量以及它对每个圆圈的影响。

这可能是因为这种不稳定的反应结合圆圈在一轮计算中进行多次碰撞,使得它们相互移动。当一个圆圈对任何碰撞进行180度转弯时,这意味着如果它碰撞两次(或任何偶数),它就会继续前进,好像什么都没发生一样。

答案 1 :(得分:0)

在我看来,一个半径进入另一个半径,你会发现一个碰撞,但是,在你能够超出半径之前,你再次检测到碰撞并且方向以错误的方式再次反转。一旦一个圆圈在另一个圆圈内,这将导致两个圆圈永远振动。

答案 2 :(得分:0)

我认为你需要检查碰撞,当它被检测到时,将气泡从它碰撞的物体上移开,这样就没有重叠了。现在你检查碰撞,但允许它们在此期间重叠,直到反向速度可以解决这种情况。永远不应该重叠。

答案 3 :(得分:0)

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;
}
}

您需要撤消导致冲突的操作,因为这会使气泡处于某种非法状态