使用 THREE.js 的等距相机 [英] Isometric camera with THREE.js

问题描述

如何将相机角度设置为类似于

three.js r.73

How can I set the camera angle to something like the isometric projection?

解决方案

To get an isometric view, you can use an OrthographicCamera. You then need to set the camera's orientation properly. There are two ways to do that:

Method 1 - use camera.lookAt()

var aspect = window.innerWidth / window.innerHeight;
var d = 20;
camera = new THREE.OrthographicCamera( - d * aspect, d * aspect, d, - d, 1, 1000 );

camera.position.set( 20, 20, 20 ); // all components equal
camera.lookAt( scene.position ); // or the origin

method 2 - set the x-component of camera.rotation

camera.position.set( 20, 20, 20 );
camera.rotation.order = 'YXZ';
camera.rotation.y = - Math.PI / 4;
camera.rotation.x = Math.atan( - 1 / Math.sqrt( 2 ) );

fiddle: http://jsfiddle.net/q3m2kh5q/

three.js r.73

这篇关于使用 THREE.js 的等距相机的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！