# How to fit object inside canvas

**URL:** <https://discourse.threejs.org/t/how-to-fit-object-inside-canvas/26448>\
**Category:** Questions\
**Tags:** camera, geometry\
**Created:** [May 20, 2021, 2:04am UTC](https://discourse.threejs.org/t/how-to-fit-object-inside-canvas/26448 "2021-05-20T02:04:01Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![jonjie](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jonjie/32/18978_2.png) [@jonjie](https://discourse.threejs.org/u/jonjie)\
**Post date:** [May 20, 2021, 2:04am UTC](https://discourse.threejs.org/t/how-to-fit-object-inside-canvas/26448/1 "2021-05-20T02:04:01Z")

</div>

I’m currently using (and I’m new here) this library to create 3d objects, but unfortunately I cannot fit the object inside the canvas. It’s always overflowing outside the canvas if the object is a bit long.

[Stackoverflow link](https://stackoverflow.com/questions/67582799/how-to-fit-object-inside-canvas-in-three-js)

---

<div class="post-metadata">

**Author:** ![hofk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/hofk/32/44944_2.png) [@hofk](https://discourse.threejs.org/u/hofk)\
**Post date:** [May 20, 2021, 7:29am UTC](https://discourse.threejs.org/t/how-to-fit-object-inside-canvas/26448/2 "2021-05-20T07:29:21Z")

</div>

Change the camera position, e.g.

`camera.position.z = 1.2 * boxWidth;`

Try

` camera.lookAt( , , );`

---

<div class="post-metadata">

**Author:** ![jonjie](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/jonjie/32/18978_2.png) [@jonjie](https://discourse.threejs.org/u/jonjie)\
**Post date:** [June 4, 2021, 1:16am UTC](https://discourse.threejs.org/t/how-to-fit-object-inside-canvas/26448/3 "2021-06-04T01:16:34Z")

</div>

@hofk I tried, but I got the same result. Please see my update above.

---

<div class="post-metadata">

**Author:** ![trusktr](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/trusktr/32/13726_2.png) [@trusktr](https://discourse.threejs.org/u/trusktr)\
**Post date:** [June 7, 2021, 6:07am UTC](https://discourse.threejs.org/t/how-to-fit-object-inside-canvas/26448/4 "2021-06-07T06:07:25Z")

</div>

Here are some functions to fit objects within a view using a few lines of trigonometry math:

> [@Functions to calculate the visible width / height at a given z-depth from a perspective camera](https://discourse.threejs.org/t/functions-to-calculate-the-visible-width-height-at-a-given-z-depth-from-a-perspective-camera/269/28):
>
> In case it helps anyone, here’s how to fit an object (most likely a flat plane) on the screen so that it “fits” depending on aspect ratio. For example, if we have an object taller than it is wide we want the Y dimension (the tall dimension) to fit within the view, but if the object is wider than it is tall we want the X dimension (the width dimension) to fit within view. The following distanceToFitObjectToView function will tell you at what distance to place the object so that it fits within vi…