Wrap frustum around an object? 🎥

jojoghaida · February 24, 2019, 7:01am

Hey,

I’m developing an app that showcases a few objects in 3D space. As the users clicks through an interface to preview said objects, I need each object to fill the camera’s frustum. I already figured out how to center the objects in the view but they are too far away / small on screen. Any tips or resources?

EDIT: for orthographic camera !

Mugen87 · February 24, 2019, 11:51am

Check out how the camera is configured in the following viewer: https://gltf-viewer.donmccurdy.com/

The idea is to make the adjustments based on the bounding box of your loaded object. The relevant code is:

github.com

donmccurdy/three-gltf-viewer/blob/68e8bfbf0087e7778c9a3e317156564efbdde0e6/src/viewer.js#L218-L246


object.updateMatrixWorld();
const box = new THREE.Box3().setFromObject(object);
const size = box.getSize(new THREE.Vector3()).length();
const center = box.getCenter(new THREE.Vector3());


this.controls.reset();


object.position.x += (object.position.x - center.x);
object.position.y += (object.position.y - center.y);
object.position.z += (object.position.z - center.z);
this.controls.maxDistance = size * 10;
this.defaultCamera.near = size / 100;
this.defaultCamera.far = size * 100;
this.defaultCamera.updateProjectionMatrix();


if (this.options.cameraPosition) {


  this.defaultCamera.position.fromArray( this.options.cameraPosition );
  this.defaultCamera.lookAt( new THREE.Vector3() );

This file has been truncated. show original

jojoghaida · February 25, 2019, 2:52am

Sorry I forgot to mention this is for an orthographic camera display. I will update the thread title… thank you for this but moving an orthographic camera’s position will have no effect on scale of the objects shown.

Mugen87 · February 25, 2019, 9:50am

You might want to adjust the zoom property instead. This is the way how OrbitControls implements dollying (zooming) with an orthographic camera.

Topic		Replies	Views
Moving an object to best fit the camera frustum Questions frustum	4	702	February 27, 2023
Adding an object to an orthographic camera without its frustum affecting its perceived shape Questions orthographic-camera	1	377	August 16, 2021
Near frustum plane in OrthographicCamera not working Questions orthographic-camera	4	2735	February 15, 2019
How to keep Two object always inside the camera view frustum Questions camera-controls , camera , perspective-camera	3	745	October 10, 2023
Positioning camera according to size of the object Questions camera , bounding-box , gltf , threejs	7	2358	August 12, 2024

Wrap frustum around an object? 🎥

Related topics