Skip to content Skip to sidebar Skip to footer

What Is Required To Convert Threejs Perspective Camera To Orthographic

I have some code that converts a perspective camera to an orthographic camera. The problem is that when I make the conversion, the model becomes very tiny and hard to see. I have c

Solution 1:

Let's assume you have a perspective view with a given vertical field of view angle fov_y (in degrees) and you know the size of the viewport width and height. Furthermore, you have the near and far plane. These are the values which you use to setup the THREE.PerspectiveCamera:

perspCamera = new THREE.PerspectiveCamera( fov_y, width / height, near, far );

Also, you know the position of the object and the position of the camera. An object doesn't have only a single position, but you have to choose a representative position for its depth.

First you have to calculate the depth of the object.

var v3_object = .... // THREE.Vector3 : positon of the objectvar v3_camera = perspCamera.position;

var line_of_sight = new THREE.Vector3();
perspCamera.getWorldDirection( line_of_sight );

var v3_distance = v3_object.clone().sub( v3_camera );
depth = v3_distance.dot( line_of_sight );

Then you have to calculate the "size" of the rectangle which is projected to the viewport at the depth:

enter image description here

aspect = width / height;height_ortho = depth * 2 * Math.atan( fov_y*(Math.PI/180) / 2 )
width_ortho  = height_ortho * aspect;

With these values the THREE.OrthographicCamera can be setup like this:

var orthoCamera = new THREE.OrthographicCamera(
    width_ortho  / -2, width_ortho   /  2,
    height_ortho /  2, height_ortho  / -2,
    near, far );
orthoCamera.position.copy( perspCamera.position ); 


The positon and direction of the perspective camera can be committed to the orthographic camera like this:

orthoCamera.position.copy( perspCamera.position );
orthoCamera.quaternion.copy( perspCamera.quaternion ); 

See also stackoverflow question Three.js - Find the current LookAt of a camera?

Post a Comment for "What Is Required To Convert Threejs Perspective Camera To Orthographic"