在没有轨迹球控件或其他相机控件库的threeJS中缩放相机答案

【问题标题】：zooming camera in threeJS without trackball controls or other camera control library在没有轨迹球控件或其他相机控件库的threeJS中缩放相机
【发布时间】：2012-05-08 10:25:35
【问题描述】：

我正在尝试使用threeJS 来控制我场景中的相机。我目前使用键盘上的左右键将相机设置为围绕我的对象绕一圈运行。但是有人知道我会如何缩放吗？这是我当前的代码：

camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 1, 10000 );
camera.position.set(0,20,35);
var rotSpeed = .02;

function checkRotation(){

    var x = camera.position.x,
        y = camera.position.y,
        z = camera.position.z;

    if (keyboard.pressed("left")){ //MH - find a way to do this in a switch statement 
        camera.position.x = x * Math.cos(rotSpeed) + z * Math.sin(rotSpeed);
        camera.position.z = z * Math.cos(rotSpeed) - x * Math.sin(rotSpeed);
    } else if (keyboard.pressed("right")){
        camera.position.x = x * Math.cos(rotSpeed) - z * Math.sin(rotSpeed);
        camera.position.z = z * Math.cos(rotSpeed) + x * Math.sin(rotSpeed);
    } else if(keyboard.pressed("up")){
        //zoom in
    } else if (keyboard.pressed("down")){
        //zoom out
    }

    camera.lookAt(scene.position);

}

【问题讨论】：

标签： javascript 3d three.js

【解决方案1】：

如果你想要一个真正的变焦，不移动相机，那么你可以玩相机的视野（fov）参数：

  camera.fov *= zoomFactor;
  camera.updateProjectionMatrix();

见：http://jsfiddle.net/bvcCB/87/

如果要将相机移动到目标附近（或远处），则计算从相机位置到目标的矢量，并沿该矢量移动相机位置。

【讨论】：

啊！尝试了 fov 但忘记更新投影矩阵。谢谢！

【解决方案2】：

从 r69 开始，您现在可以使用 camera.zoom：

camera.zoom = zoomFactor;
camera.updateProjectionMatrix();

【讨论】：