如何围绕一个物体旋转THREE.PerspectiveCamera

Question

我正在制作一个程序，您可以单击对象，缩放到它，然后通过按住右鼠标按钮并拖动来从各个角度查看它。我需要相机围绕对象旋转，而不是将对象旋转并让相机观察它。老实说，我真的不知道如何进行数学计算！

为了测试，已经有一个游戏对象，我们已经选择并正在查看其xyz。

var g = new GameObject(500, 0, 0);//The game object with xyz
this.selected = g;//set selected to g

//Create and set the camera
this.camera = new THREE.PerspectiveCamera(45, w/h, 1, 10000);
this.camera.position.x = 0;
this.camera.position.y = 0;
this.camera.position.z = 0;

//set camera to look at the object which is 500 away in the x direction
this.camera.lookAt(new THREE.Vector3(this.selected.x, this.selected.y, this.selected.z));

摄像机与物体之间的半径为500，当选中并旋转时，摄像机应始终保持距离500。

我在这里更新场景：

Main.prototype.update = function(){

    this.renderer.render(this.scene, this.camera);//scene is just some ambient lighting

    //what to do when mouse right is held down
    if(this.rightMouseDown){

        //placeholder functionality, needs to rotate around object based on mouse movements
        this.camera.position.x -= 5;

    }
}

如何以500的半径围绕g旋转此相机？！？！

- Andrew Fisher

---

为什么不使用轨迹球控件？http://threejs.org/examples/misc_controls_trackball.html - gaitat

Answer 1

正如gaitat所提到的那样，轨迹球控件是开始配置多个参数以使相机旋转/旋转变得容易的最佳选择。这种方法的一个巨大潜在好处（特别适用于您的项目）是避免“万向锁”，它是在旋转操作中常常导致沮丧的原因。以下链接可能会帮助您使用轨迹球控件和轨道控件：

使用鼠标在Three.js中旋转相机

另一个选项是在动画循环中自己设置相机坐标，这实际上非常简单：

var angle = 0;
var radius = 500; 

function animate() {
...
// Use Math.cos and Math.sin to set camera X and Z values based on angle. 
camera.position.x = radius * Math.cos( angle );  
camera.position.z = radius * Math.sin( angle );
angle += 0.01;
...
}

另一个选择是将相机连接到一个枢轴物体上，然后只旋转该枢轴：

var camera_pivot = new THREE.Object3D()
var Y_AXIS = new THREE.Vector3( 0, 1, 0 );

scene.add( camera_pivot );
camera_pivot.add( camera );
camera.position.set( 500, 0, 0 );
camera.lookAt( camera_pivot.position );
...
camera_pivot.rotateOnAxis( Y_AXIS, 0.01 );    // radians

如果您选择此选项，请注意相机对象处于“相机枢轴空间”，可能更具挑战性，难以进一步操作。

- Zob

---

谢谢，这确实很有帮助！！ - Andrew Fisher

你能进一步解释一下“相机枢轴空间”这个概念吗？我正在尝试让相机围绕物体旋转，而不会在顶部和底部夹住（就像轨道控制器和你的代码一样）。我需要一个更“干净”的中心旋转方式——就像你拿着物体自由旋转它们一样（不仅仅是在phi和theta上旋转）。如果您能帮忙，我将非常感激。 - dylnmc

还有第一个问题，你如何设置相机的y轴旋转一整圈？ - B''H Bi'ezras -- Boruch Hashem