Javascript 使用角度的二维弹性球碰撞

是的，这上面有一些线索，但使用角度不多，我真的想用这种方法来解决， 我现在被困在为圆设置新的速度角上。我一直在看： 作为参考，但我现在被卡住了

有人能解释一下吗

cx/cy/cx2/cy2=球1和2的中心x/y。 vx/vy/vx2/vy2=球1和2的x/y速度

function checkCollision() {
var dx = cx2 - cx;  //distance between x
var dy = cy2 - cy;  // distance between y
var distance = Math.sqrt(dx * dx + dy * dy);

var ang = Math.atan2(cy - cy2, cx - cx2);

// was displaying these in a div to check
var d1 = Math.atan2(vx, vy); //ball 1 direction
var d2 = Math.atan2(vx2, vy2); //ball 2 direction

// this is where I am stuck, and i've worked out this is completely wrong now
// how do i set up the new velocities for 
var newvx = vx * Math.cos(d1 - ang);
var newvy = vy * Math.sin(d1 - ang);
var newvx2 = vx2 * Math.cos(d2 - ang); 
var newvy2 = vy2 * Math.sin(d2 - ang);


if (distance <= (radius1 + radius2)) {
    //Set new velocity angles here at collision..
}

函数checkCollision（）{
var dx=cx2-cx；//x之间的距离
var dy=cy2-cy；//y和y之间的距离
变量距离=数学sqrt（dx*dx+dy*dy）；
var ang=数学atan2（cy-cy2，cx-cx2）；
//正在将这些显示在div中以进行检查
var d1=数学atan2（vx，vy）；//球1方向
var d2=数学atan2（vx2，vy2）；//球2方向
//这就是我被困的地方，我发现这是完全错误的
//如何设置新的速度
var newvx=vx*Math.cos（d1-ang）；
var newvy=vy*Math.sin（d1-ang）；
var newvx2=vx2*Math.cos（d2-ang）；
var newvy2=vy2*Math.sin（d2-ang）；
如果（距离几个方向：

•如评论中所述，仅使用弧度（不超过*180/PI）。

•atan2将y作为第一个参数，x作为第二个参数

var d1 = Math.atan2(vy, vx); //ball 1 direction in angles
var d2 = Math.atan2(vy2, vx2); //ball 2 direction in angles

•要旋转矢量，首先计算其范数，然后仅以新角度投影：

var v1 = Math.sqrt(vx*vx+vy*vy);
var v2 = Math.sqrt(vx2*vx2+vy2*vy2);

var newvx = v1 * Math.cos(d1 - ang);
var newvy = v1 * Math.sin(d1 - ang);
var newvx2 = v2 * Math.cos(d2 - ang); 
var newvy2 = v2 * Math.sin(d2 - ang);

•当碰撞已经发生时，您正在检测碰撞，因此两个圆都重叠，但您没有解决碰撞，这意味着在下一次迭代中，圆可能仍然重叠，导致新的碰撞和新的方向……未解决，等等。。
-->>解决碰撞后，需要确保两个圆不再碰撞

•最后一个问题，但不是一个小问题，是如何计算角度。对不起，您没有更多时间了，但这将有助于您和我们建立一个（多个）方案，显示如何计算角度

此处更新（但不工作）代码笔：


祝你好运

编辑：

您在codepen.io/anon/pen/oXZvoe上的代码简化为：

 var  angle = Math.atan2(dy, dx),
      spread = minDistance - distance,
      ax = spread * Math.cos(angle),
      ay = spread * Math.sin(angle);

    vx -= ax;
    vy -= ay;
    vx2 += ax;
    vy2 += ay;

您正在从速度中减去两个圆之间的间隙。由于稍后将速度添加到位置，因此将进行空间分离（=>不再发生碰撞）。

我认为要理解vx-=ax的意思，我们必须记住牛顿：v=a*t，其中a是加速度，所以基本上做vx=-ax意味着施加一个力，力的方向是两个中心之间的方向，以及两个圆碰撞（扩散）的量作为强度，这个数量显然是随机的，因此你会看到数值上的不稳定性：有时是一个小的影响，有时是一个大的影响

在这里查看持续打孔版本：


在进一步挖掘之前，这里有一个明显的错误：你用的是cos和sin和度，当它们取弧度的时候或者，如果你想为你的调试转换回度数。@游戏炼金术士好的，谢谢你，我会改变它，但我从那里去哪里呢？它仍然以错误的角度碰撞和反射。发现了这个-还没有分析差异：，但认为它可能会帮助你感谢你的详细回答和帮助，谢谢！我不确定该从哪里开始我在这里，但我会尝试一些东西@GameAlchemistry我现在有一个工作的例子：我仍然不知道这是如何工作的，如果你能解释一下，那就太好了！我在这方面有很多帮助。
var angle = Math.atan2(dy, dx),
  spread = minDistance - distance,
  ax = spread * Math.cos(angle),
  ay = spread * Math.sin(angle);

// solve collision (separation)
cx -= ax;
cy -= ay;

// give a punch to the speed
var punch = 2;

vx -= punch*Math.cos(angle);
vy -= punch*Math.sin(angle);
vx2 += punch*Math.cos(angle);
vy2 += punch*Math.sin(angle);