Three.js - 相机旋转和 TransformControls答案

【问题标题】：Three.js - Camera rotation & TransformControlsThree.js - 相机旋转和 TransformControls
【发布时间】：2016-01-20 09:31:49
【问题描述】：

在我的 three.js 场景中，我可以添加和编辑对象。我最近添加了一个“旋转相机”复选框，效果很好。但问题是附加到对象的 transformControls 似乎旋转不同：当我停止旋转时，控件与对象相比发生了位移。这是我的功能：

function optionCameraRotation() {
        "use strict";
        return {
            ROTATION_Y_AXIS : false
        };
    }
    var rotationOption = optionCameraRotation();

我的 GUI.DAT 按钮：

guiCamera.add(rotationOption, 'ROTATION_Y_AXIS').name('Rotation Active');

还有我的 animate() 函数：

function animate() {
    requestAnimationFrame( animate );
    THREE.AnimationHandler.update( 0.05 );
    if (rotationOption.ROTATION_Y_AXIS) {
        scene.rotation.y = (scene.rotation.y + 0.005 * 4)  % (Math.PI * 2);
    }
    renderer.render( scene, camera );
    update();
}

问题出在哪里？

【问题讨论】：

scene.rotation 不是camera.rotation
是的，我知道，但如果我用camera.rotation 替换它，它不会进行轮换

标签： javascript rotation three.js perspectivecamera

【解决方案1】：

我只需要像这样更正我的 animate() 函数中的 if 语句：

if (rotationOption.ROTATION_Y_AXIS) {
    var timer = Date.now() * 0.0001;

    camera.position.x = Math.cos( timer ) * 200;
    camera.position.z = Math.sin( timer ) * 200;
    camera.lookAt( scene.position );

    renderer.render( scene, camera );
}

【讨论】：