# How can I fit a 3D model within the bounding area of an orthographic camera?

**URL:** https://discourse.threejs.org/t/how-can-i-fit-a-3d-model-within-the-bounding-area-of-an-orthographic-camera/56734
**Category:** Questions
**Tags:** scale, orthographic-camera, model, geometry, threejs, gltf
**Created:** [October 6, 2023, 7:32pm UTC](https://discourse.threejs.org/t/how-can-i-fit-a-3d-model-within-the-bounding-area-of-an-orthographic-camera/56734 "2023-10-06T19:32:30Z")
**Posts on this page:** 2
**Page:** 1

<div class="post-metadata">

### Author: ![Sheraz\_Siddiqui](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/sheraz_siddiqui/32/40659_2.png) [@Sheraz\_Siddiqui](https://discourse.threejs.org/u/Sheraz_Siddiqui)
#### Post date: [October 6, 2023, 7:32pm UTC](https://discourse.threejs.org/t/how-can-i-fit-a-3d-model-within-the-bounding-area-of-an-orthographic-camera/56734/1 "2023-10-06T19:32:30Z")

</div>

I have a 3D model, and I want to display it similarly to the sample image below on mobile devices with different aspect ratios. What should be the right approach to achieve this using an orthographic camera?

 ![Screenshot 2023-10-07 at 12.31.36 AM](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/a/0/a0a94e80fb8a73249608ae6cc5b93b262a0f7bf1.png)

---

<div class="post-metadata">

### Author: ![PavelBoytchev](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/pavelboytchev/32/38639_2.png) [@PavelBoytchev](https://discourse.threejs.org/u/PavelBoytchev)
#### Post date: [October 7, 2023, 1:52pm UTC](https://discourse.threejs.org/t/how-can-i-fit-a-3d-model-within-the-bounding-area-of-an-orthographic-camera/56734/2 "2023-10-07T13:52:17Z")

</div>

Most likely you would want to do this:

- get the horizontal and vertical size of the model (with [`THREE.Box3`](https://threejs.org/docs/?q=box3#api/en/math/Box3) and its method [`setFromObject`](https://threejs.org/docs/?q=box3#api/en/math/Box3.setFromObject))
- scale the model so that its size fits the canvas (with the camera’s [`zoom`](https://threejs.org/docs/?q=boundingbox#api/en/cameras/OrthographicCamera.zoom) property and [`updateProjectionMatrix`](https://threejs.org/docs/?q=boundingbox#api/en/cameras/OrthographicCamera.updateProjectionMatrix) method)

Demo:

[https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/6/06aa690dcf5acca91c6836b8362b7cec6c7749c7.mp4](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/3X/0/6/06aa690dcf5acca91c6836b8362b7cec6c7749c7.mp4)
