javascript - 在没有轨迹球控件或其他相机控制库的情况下在 threeJS 中缩放相机

标签 javascript 3d three.js

我正在尝试使用 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);

}

最佳答案

如果你想要真正的变焦,而不需要移动相机,那么你可以使用相机的视野 (fov) 参数:

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

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

如果您想将相机移近(或远离)目标,则计算从相机位置到目标的矢量,并沿该矢量移动相机位置。

关于javascript - 在没有轨迹球控件或其他相机控制库的情况下在 threeJS 中缩放相机,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10354574/

相关文章:

javascript - 在 cordova 中安装插件从我的项目中删除了所有文件(index.js 和 index.html 除外)

javascript - 缺少 "PLAIN"nodemailer 的凭据

javascript - Sequelize TypeError : Cannot convert undefined or null to object

ios - 适用于 iOS 的不带 WebGL 的交互式 3D 模型

c++ - 3D 图形批处理

javascript - 如何正确将模块导入到 Threejs 项目中?

javascript - 如何解决 Three.js 游戏中随着时间的推移出现的滞后问题

javascript - 从 CDN 运行 babel 时,如何避免 React 应用出现错误 'Unexpected token <'?

c++ - 对同一图形应用多个同时旋转

three.js - Threejs : PointCloudMaterial size compared to ShaderMaterial gl_PointSize with size attenuation