加载时three.js css3d全景停止动画

Question

我正在使用three.js css3d全景图，并且我希望在加载时停止动画。我想要一个静态全景加载，它只移动抛出用户的行动。我该怎么做呢？

我使用的代码与示例http://threejs.org/examples/#css3d_panorama中的代码相同

function animate() {

    requestAnimationFrame(animate);

    lon +=  0.1;
    lat = Math.max( - 85, Math.min( 85, lat ) );
    phi = THREE.Math.degToRad( 90 - lat );
    theta = THREE.Math.degToRad( lon );

    target.x = Math.sin( phi ) * Math.cos( theta );
    target.y = Math.cos( phi );
    target.z = Math.sin( phi ) * Math.sin( theta );

    camera.lookAt( target );

    renderer.render( scene, camera );  

}

感谢您的帮助

Answer 1

下面是你的问题：

  lat = Math.max( - 85, Math.min( 85, lat ) );
  phi = THREE.Math.degToRad( 90 - lat );
  theta = THREE.Math.degToRad( lon );

  target.x = Math.sin( phi ) * Math.cos( theta );
  target.y = Math.cos( phi );
  target.z = Math.sin( phi ) * Math.sin( theta );

您可以看到上面的线条为您的相机设置动画。

 camera.lookAt( target ); //  see the importance

相机正在看着目标，从我看到的是targetx，y，z位置随着时间的推移应用了动画：target.z = Math.sin( phi ) * Math.sin，然后渲染器正在渲染场景->你的相机->你的目标。