切换threejs控件(从TrackBall到FlyControls,反之亦然)

Question

我想要实现的是拥有两种控制模式,一种是免费的"飞行"控制模式,另一种是以物体为中心的控制模式(轨迹球),按下按钮可以在它们之间无缝切换.

我最初尝试使用TrackBallControls和FlyControls.这两个问题是,TrackballControls基于欧拉角,而FlyControls则基于Quartenions.我尝试将camera.rotation矢量转换为四元数,

quaternion.setFromEuler( target ); //where target, a Vector3 that contains degrees

并手动设置位置(因为它们使用相同的位置对象),虽然它似乎正在工作,但稍微旋转相机 - 并切换控件,开始产生可怕的错误结果.此外,从四元数(setEulerFromQuaternion)中获取Euler角度会导致错误的数据.

因此,虽然我能够在它们之间切换,但我始终无法同步它们的旋转坐标,所以"在开关上",而相机位置正确时,旋转是错误的.

PS.我使用FirstPersonControls(欧拉角也是如此)得到了一些结果,但屏幕lat,它使用的长方法非常容易出错,并且在Z轴旋转时完全失败.

Answer 1

这样的事情怎么样？

function onClick() {

    var prevCamera = camera;

    camera = new THREE.PerspectiveCamera(...);
    camera.position.copy( prevCamera.position );
    camera.rotation.copy( prevCamera.rotation );

    var MODE = { TRACKBALL: 0, FLY: 1 };

    switch( mode ) {

        case MODE.FLY:

            controls = new THREE.TrackballControls( camera );

            mode = MODE.TRACKBALL;

            break;

        case MODE.TRACKBALL:

            controls = new THREE.FlyControls( camera );

            mode = MODE.FLY;

            break;

    }

}