Isometric view using PerspectiveCamera

Questions
1

I want to show the loaded model as in an isometric view in my scene.
I’m using PerspectiveCamera, also doing camera.position.set(20, 20, 20);
However, in some cases (depends on model size), the model is not perfectly fit to the scene, zoomed in or zoomed out. I am able to see isometric view, but how to make fit the model to my scene?

Thanks
Jezz

2

Hi!
What about THREE.OrthographicCamera()?

3

How about using:

var OFFSET = 20;

camera.position.set(object.geometry.boundingSphere.radius + OFFSET, 0, 0 );

var sphericalCoord = new THREE.Spherical();
sphericalCoord.setFromVector3( camera.position );
sphericalCoord.phi = THREE.Math.degToRad( 45 );
sphericalCoord.theta = THREE.Math.degToRad( 45 );

var vec = new THREE.Vector3().setFromSpherical(sphericalCoord);

camera.position.set( vec.x, vec.y, vec.z );
1 Like
4

Combining both approaches:

camera.position.setScalar(1).setLength(object.geometry.boungindSphere.radius + OFFSET);

1 Like
5

but still the model is not fit to scene.

6

May be you can change the offset value as per your need.
If still it doesn’t work, would encourage you to share a sample jsfiddle.

7

I think, you’re looking for something like this:

2 Likes
8

this may also be of some interst?

9

This time being I have handled the situation by

Making camera x and y position to 0, and z position by model size.
Then I used OrbitControls’s rotateLeft and rotateUp methods to make it to appear isometric.

camera.position.set(0, 0, Math.max(mesh.geometry.boundingBox.max.x * 5, mesh.geometry.boundingBox.max.y * 5, mesh.geometry.boundingBox.max.z * 5));
controls.rotateLeft(-.8);
controls.rotateUp(.6);