Question

我试图让相机旋转并围绕一个点进行缩放。我不想使用 THREE.TrackBallControls 因为我看到它只在缩放时修改fov，这不是我想要的。

我使用这个简单的等式：http://en.wikipedia.org/wiki/Sphere#Equations_in。要计算球体上的点，此点将是摄像机的位置。

在three.js

var point = new THREE.Vector3(
    radius * Math.cos(theta) * Math.sin(phi),
    radius * Math.sin(theta) * Math.sin(phi),
    radius * Math.cos(phi)
);
point.add(center);

要操纵它，我使用：

左键，旋转：x coord === theta和y coord === phi
鼠标中键，用于缩放：放大/缩小=== radius

它不能很好地工作，特别是对于“phi＆＃39;旋转，可能因为它定义在0和PI之间。

使用 Quaternion.Slerp ？

可能有更好的解决方案

编辑：

我的相机：

aspectRatio = container.offsetWidth / container.offsetHeight;
camera = new THREE.OrthographicCamera( -aspectRatio * viewSize / 2, aspectRatio * viewSize / 2, viewSize / 2, -viewSize / 2, -10, 10 );
camera.position.x = 0.004;
camera.position.y = 0.004;
camera.position.z = 0.004;
camera.lookAt(new THREE.Vector3(0, 0, 0))
scene.add(camera);

我的OrbitControls：

controls = new THREE.OrbitControls ( camera );
controls.rotateSpeed = 1.0;
controls.zoomSpeed = 1.2;
controls.keyPanSpeed = 0.8;
controls.noZoom = false;
controls.noPan = false;

使用鼠标左键（旋转）时摄像机位置改变。

当使用鼠标中键（缩放）时，camera.position仍然是相同的。

在渲染功能中进行检查：

function render() {
  // update camera controls
  controls.update();
  console.log(camera.position);
  // actually render the scene
  renderer.render( scene, camera );
}

Three.js，相机围绕一个点旋转

0 个答案: