threejs 相机围绕原点旋转答案

【问题标题】：threejs camera rotate around originthreejs 相机围绕原点旋转
【发布时间】：2015-12-09 04:57:54
【问题描述】：

g'day - 我正在尝试做一些看似简单的事情，但它对我不起作用 - 我在原点有一堆物体，我想围绕它们旋转相机，始终指向原点.据我通过阅读文档可以看出，这应该有效：

camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
camera.position.z = 500;camera.position.x = 0;camera.position.y = 0;
scene.add(camera);

var spin = Tween.create().time(5000).from( {angle:0}).to({angle:2 * Math.PI})
  .apply( function (v) {
    camera.position.x = 500 * Math.cos(v.angle);
    camera.position.z = 500 * Math.sin(v.angle);
    camera.lookAt(0, 0, 0);
});
spin.chain(spin);
spin.start();

但是原点的盒子很快飞离屏幕，然后偶尔又回来 - 所以我显然完全不理解一些东西 - 我想，鉴于我有一个 0,0,0 的盒子，我看着0,0,0，那么就不可能把相机放在我看不到盒子的任何地方？

【问题讨论】：

什么是“起源”？创建一个 jsfiddle 来帮助我们帮助您。
你能确认相机不在盒子里吗？尝试缩小盒子的大小，或者增加相机的距离。

标签： javascript camera three.js

【解决方案1】：

也许您正在寻找的是轨道控制。

在这里你可以找到一个演示：OrbitControl Demo

OrbitControl 附带了一组非常有用的属性，可用于管理相机围绕 THREE.Vector3（在您的情况下为 0,0,0）轨道运行

编辑：

这是一个使用 Orbit Control 围绕原点的轨道相机示例：

orbit = new THREE.OrbitControls(camera, renderer.domElement);
orbit.target = new THREE.Vector3(0,0,0); // set the center
orbit.maxPolarAngle =  Math.PI/2; // prevent the camera from going under the ground
orbit.minDistance = 140; // the minimum distance the camera must have from center
orbit.maxDistance = 250; // the maximum distance the camera must have from center
orbit.zoomSpeed = 0.3; // control the zoomIn and zoomOut speed
orbit.rotateSpeed = 0.3; // control the rotate speed

【讨论】：