Javascript 为什么在Three.js中，这个旋转速度会降低（1/2）倍？

我正在模拟地球绕其轴线的自转。因为地球绕其轴线的一次完整自转等于

(2*Math.PI)

弧度，我想我可以计算地球每分钟（每帧）的自转

。我目前使用requestAnimationFrame（）方法以60FPS的速度渲染，这意味着程序每运行一秒钟，我就应该模拟一小时的实际地球自转。我在Chrome中检查了javascript控制台，它的渲染速度为60FPS。然而，模拟的运行速度似乎是原来的两倍，也就是说，每12秒我就有一个完整的旋转，而不是每24秒。如果我将表达式更改为

(2*Math.PI)/(24*60*2)

，突然我得到了正确的旋转速度，24秒=1个完整旋转。我很高兴我能让程序运行，但令人烦恼的是，我不明白为什么我需要将表达式乘以（1/2）因子才能实现这一点。有人知道我为什么会有这种行为吗？提前谢谢

我在渲染函数中使用的表达式是

earth.rotation.y += (2*Math.PI)/(24*60*2)

---

.

requestAnimationFrame

使用每个帧可用的最佳帧时间，它可以稍微更改，并在几秒钟内修改移动

我无法解释您令人震惊的结果，但是，当需要纯时间相关的运动时，可以做的是将运动乘以自上次渲染以来的时间：

var lastDate = new Date();

function render () {

    var now = new Date();
    var delay = now - lastDate;
    lastDate = now;

    earth.rotation.y += delay * your-rotation-coeff

    requestAnimationFrame( render );
    renderer.render( scene, camera );

}

然而，

newdate（）

并不是最精确的javascript特性。这是性能。现在（）。因此，在three.js中，您可以简单地使用功能

Clock

，而不是编写前面所有的四行代码和回退代码，这样做可以更快地实现：

var clock = new THREE.Clock();

function render () {

    earth.rotation.y += clock.getDelta() * your-rotation-coeff

    requestAnimationFrame( render );
    renderer.render( scene, camera );

}

---

正确的和高票的。一个更简单的方法是使用三个时钟，它有一个getDelta函数，请看我尝试了上面的方法。地球不会变白。

var clock = new THREE.Clock();

function render () {

    earth.rotation.y += clock.getDelta() * your-rotation-coeff

    requestAnimationFrame( render );
    renderer.render( scene, camera );

}