转动物体,使它们在Three.js中重置y旋转

时间:2016-12-12 04:10:24

标签: javascript three.js rotation physijs

使用three.js,我正在根据他们的y旋转创建一个在特定方向上移动的汽车。一个例子是90度。我使用object.translateZ()将它们向前移动但我遇到了问题。

我正在使用physijs来模拟汽车。相互碰撞的汽车可能会改变它们的y旋转(因为碰撞),我想找到一种方法让汽车慢慢地将它们的旋转变回原来的旋转,就像他们转向回到路上一样。没有这个我的城市非常混乱。

这是我已经使用的代码(这只是其中的一部分):

var targetRotation = 90
var rotation = car.mesh.rotation.y * 180 / Math.PI //to convert to degrees

我想找到一种方法来慢慢改变汽车的旋转,使其与目标旋转相同。

任何帮助表示赞赏! (但某种功能会很完美)

1 个答案:

答案 0 :(得分:2)

我之前在其他系统(2D,而不是Three.js)中做过这样的事情,基本上你想要做的就是逐渐增加角度,直到你达到足够接近的达到目标角度。通常这意味着浮动小于你递增的转动速度(所以你不要超过"超过"值)。

增量的大小取决于您希望它们转动的速度。

您还需要检查是否更好地增加角度或减小(顺时针或逆时针转动),具体取决于您是否接近360或0。这可以防止汽车转动"漫长的方式"周围。你可以通过查看差异是大于还是小于180来找到它。

我们可以使用模数运算符来获得真实的"角度在-360/360之间。

var currentAngle = car.mesh.rotation.y * 180 / Math.PI; //car's angle in degrees
var targetAngle = 90; //preferred angle *this time* ;)
var turningSpeed = 1; //one degree per update (wayyy to high for real stuff, usually)
currentAngle = currentAngle % 360; //get the 0-360 remainder
if ( Math.abs(targetAngle - currentAngle) >= turningSpeed) {
  var addto = 0
  if (targetAngle - currentAngle < 0) {
    addto = 360
  }
  if ( targetAngle - currentAngle + addto <= 180 ) { 
    currentAngle += turningSpeed;  
  }
  else {
     currentAngle -= turningSpeed;
  }
}
else { currentAngle = targetAngle; } //we're close enough to just set it
car.mesh.rotation.y = ( currentAngle * Math.PI ) / 180; // back to radians!