# How to change the position of perspective camera vertically?

**URL:** <https://discourse.threejs.org/t/how-to-change-the-position-of-perspective-camera-vertically/14106>\
**Category:** Questions\
**Tags:** perspective-camera, camera-controls\
**Created:** [April 6, 2020, 6:27am UTC](https://discourse.threejs.org/t/how-to-change-the-position-of-perspective-camera-vertically/14106 "2020-04-06T06:27:07Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![shonsirsha](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/shonsirsha/32/8962_2.png) [@shonsirsha](https://discourse.threejs.org/u/shonsirsha)\
**Post date:** [April 6, 2020, 6:27am UTC](https://discourse.threejs.org/t/how-to-change-the-position-of-perspective-camera-vertically/14106/1 "2020-04-06T06:27:07Z")

</div>

Hi all,

This is the perspective that what I want to achieve

 ![Screenshot 2020-04-06 at 08.19.37](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/2/2b24eac03ad14457bc4db98e16c089424d8bbc33.jpeg)

I am trying to achieve that with perspective camera, and this is my current setup:  
camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 1, 1000);  
camera.position.x = 3;  
camera.position.y = 1.8;  
camera.position.z = 3.8;  
camera.zoom = 1.1;

and this is how it looks like (the view of the floor is too big):

 ![Screenshot 2020-04-06 at 08.20.01](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/e/e8bab44703b4c2999a9b7d3f28c192003f04e64e.jpeg)

Now, if i tried to zoom (zoom:1.5) it to look closer to the design, the text is obviously gonna get cropped out:

 ![Screenshot 2020-04-06 at 08.22.08](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/e/ecbbc433b136365ca1d8dcafdccef904b844dc44.jpeg)

So, how can I move the position of the camera along the y-axis while still looking at the same position (less floor and more text - just like the design), because if i change the value of camera.y, the camera moves vertically but not what I wanted for this case.

 ![Screenshot 2020-04-06 at 08.26.01](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/8/8b43959e56ea37b346c9338daeb8a23060445934.jpeg)  
(e.g: camera.y is 8)

Should I use lookAt? Or am I understanding it wrongly?

Any help would be appreciated, thanks!

---

<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:** [April 6, 2020, 7:13am UTC](https://discourse.threejs.org/t/how-to-change-the-position-of-perspective-camera-vertically/14106/2 "2020-04-06T07:13:15Z")

</div>

_Some camera movements._

Maybe there’s something in it for you?

See in the [Collection of examples from discourse.threejs.org](https://discourse.threejs.org/t/collection-of-examples-from-discourse-threejs-org/4315) 218  
([https://hofk.de/main/discourse.threejs/2018/index2018.html](https://hofk.de/main/discourse.threejs/2018/index2018.html))

[HumanEyesCamera](https://hofk.de/main/discourse.threejs/2018/HumanEyesCamera/HumanEyesCamera.html) - @prisoner849, hofk

```
function move( ) {
	
	if ( keyCode === 87 ) { if ( withinBorders( moveForward ) ) moveForward( camHolder ) }	// w fast vorward
	if ( keyCode === 83 ) { if ( withinBorders( moveBack ) ) moveBack( camHolder ) } // s backward a little slower
	if ( keyCode === 65 ) { if ( withinBorders( moveLeft ) ) moveLeft( camHolder ) } // a slowly leftwards
	if ( keyCode === 68 ) { if ( withinBorders( moveRight ) ) moveRight( camHolder ) } // d slowly rightwards
		
	if ( keyCode === 76 ) { turnLeft( camHolder ) } // l turn to the left
	if ( keyCode === 82 ) { turnRight( camHolder ) }	// r turn to the right
		
	if ( keyCode === 84 ) { goTop( camHolder ) } // t upstretch
	if ( keyCode === 66 ) { goBottom( camHolder ) } // b bend down
	
	if ( keyCode === 38 ) { lookUp( camera ) } // up arrow, looking higher -> camera
	if ( keyCode === 40 ) { lookDown( camera ) } // down arrow, looking deeper	-> camera
}

```

and see [Circular control used for walkable areas control](https://discourse.threejs.org/t/circular-control-used-for-walkable-areas-control/14057)

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [April 6, 2020, 8:29am UTC](https://discourse.threejs.org/t/how-to-change-the-position-of-perspective-camera-vertically/14106/3 "2020-04-06T08:29:35Z")

</div>

> [@shonsirsha](#):
>
> Should I use lookAt? Or am I understanding it wrongly?

It seems your camera still looks at the origin in your screenshots. If that’s the case, try to do something like this:

```js
camera.lookAt( 0, 1.8, 0 );

```

---

<div class="post-metadata">

**Author:** ![shonsirsha](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/shonsirsha/32/8962_2.png) [@shonsirsha](https://discourse.threejs.org/u/shonsirsha)\
**Post date:** [April 6, 2020, 8:37am UTC](https://discourse.threejs.org/t/how-to-change-the-position-of-perspective-camera-vertically/14106/4 "2020-04-06T08:37:42Z")

</div>

Thanks @Mugen87 , but where should I put this code? I tried putting it before/after the camera.position but I didn’t notice any difference.

---

<div class="post-metadata">

**Author:** ![Mugen87](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mugen87/32/5645_2.png) [@Mugen87](https://discourse.threejs.org/u/Mugen87)\
**Post date:** [April 6, 2020, 8:42am UTC](https://discourse.threejs.org/t/how-to-change-the-position-of-perspective-camera-vertically/14106/5 "2020-04-06T08:42:07Z")

</div>

Are you using a control class like `OrbitControls`?

---

<div class="post-metadata">

**Author:** ![DolphinIQ](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/dolphiniq/32/3510_2.png) [@DolphinIQ](https://discourse.threejs.org/u/DolphinIQ)\
**Post date:** [April 6, 2020, 2:50pm UTC](https://discourse.threejs.org/t/how-to-change-the-position-of-perspective-camera-vertically/14106/6 "2020-04-06T14:50:59Z")

</div>

Adjusting the camera’s `.fov` might also be helpful