# Move the camera forward in the direction its facing

**URL:** <https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364>\
**Category:** Questions\
**Tags:** transform\
**Created:** [July 4, 2019, 6:54am UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364 "2019-07-04T06:54:10Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![fullofstaff](https://avatars.discourse-cdn.com/v4/letter/f/85f322/32.png) [@fullofstaff](https://discourse.threejs.org/u/fullofstaff)\
**Post date:** [July 4, 2019, 6:54am UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364/1 "2019-07-04T06:54:10Z")

</div>

hello

i build a buttons in js that move the camera in rotation left and right and forward , but when i rotate the  
the camera, and try to move forward, the forward motion not goes in the direction that the camera is facing, how can i fix this.

thanks

---

<div class="post-metadata">

**Author:** ![prisoner849](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/prisoner849/32/535_2.png) [@prisoner849](https://discourse.threejs.org/u/prisoner849)\
**Post date:** [July 4, 2019, 7:01am UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364/2 "2019-07-04T07:01:26Z")

</div>

Hi!  
Would be cool to see what and how you do in the code.

Take a look at these methods: [.translateX](https://threejs.org/docs/index.html#api/en/core/Object3D.translateX), [.translateY](https://threejs.org/docs/index.html#api/en/core/Object3D.translateY), [.translateZ](https://threejs.org/docs/index.html#api/en/core/Object3D.translateZ).

---

<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:** [July 4, 2019, 9:20am UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364/3 "2019-07-04T09:20:50Z")

</div>

You can also use [Camera.getWorldDirection()](https://threejs.org/docs/index.html#api/en/cameras/Camera.getWorldDirection) and then translate the camera along the resulting direction vector.

---

<div class="post-metadata">

**Author:** ![fullofstaff](https://avatars.discourse-cdn.com/v4/letter/f/85f322/32.png) [@fullofstaff](https://discourse.threejs.org/u/fullofstaff)\
**Post date:** [July 4, 2019, 12:03pm UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364/4 "2019-07-04T12:03:37Z")

</div>

> [@Mugen87](#):
>
> [Camera.getWorldDirection()](https://threejs.org/docs/index.html#api/en/cameras/Camera.getWorldDirection)

thanks ,  
can you show my example to how to work with Camera.getWorldDirection()] ?

---

<div class="post-metadata">

**Author:** ![sciecode](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/sciecode/32/5623_2.png) [@sciecode](https://discourse.threejs.org/u/sciecode)\
**Post date:** [July 4, 2019, 5:37pm UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364/5 "2019-07-04T17:37:29Z")

</div>

```
camera.position.add( camera.getWorldDirection() );

```

[JSFiddle](https://jsfiddle.net/aknv6j10//).

---

<div class="post-metadata">

**Author:** ![Fyrestar](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/fyrestar/32/52793_2.png) [@Fyrestar](https://discourse.threejs.org/u/Fyrestar)\
**Post date:** [July 4, 2019, 6:04pm UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364/6 "2019-07-04T18:04:18Z")

</div>

But maybe don’t create a object every time., reuse a Vector3 instead like this:

```
const direction = new THREE.Vector3;

let speed = 1.0;

function eventOrLoopOrSomething() {

    camera.getWorldDirection(direction);

    camera.position.addScaledVector(direction, speed);

}
```

---

<div class="post-metadata">

**Author:** ![sciecode](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/sciecode/32/5623_2.png) [@sciecode](https://discourse.threejs.org/u/sciecode)\
**Post date:** [July 4, 2019, 6:22pm UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364/7 "2019-07-04T18:22:09Z")

</div>

> But maybe don’t create a object every time.

Good point ✌ updated JSFiddle.  
Forgot that `getWorldDirection` creates a new vector internally when target is not provided.

> `function eventOrLoopOrSomething()`

LMAO 🤣

---

<div class="post-metadata">

**Author:** ![fullofstaff](https://avatars.discourse-cdn.com/v4/letter/f/85f322/32.png) [@fullofstaff](https://discourse.threejs.org/u/fullofstaff)\
**Post date:** [July 6, 2019, 6:24am UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364/8 "2019-07-06T06:24:31Z")

</div>

thanks

i can move forward when i rotate the camera, but still cannot find solution to the issue when i rotate the camera  
and try to move right or left or backward the direction is all off, its like the axe is not updating the camera rotation position,  
any help will be appreciated

---

<div class="post-metadata">

**Author:** ![Nik](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/nik/32/52246_2.png) [@Nik](https://discourse.threejs.org/u/Nik)\
**Post date:** [July 6, 2019, 8:49am UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364/9 "2019-07-06T08:49:09Z")

</div>

Not sure if it helps but I always create a Object3D instance where I want the camera and then parent this to something that is moving in the scene, then lerp the camera to the dummy and use lookAt to orientate the camera to a target. Not the same thing as what you are doing but maybe one possible work around [https://codepen.io/nik-lever/pen/PrEvKb](https://codepen.io/nik-lever/pen/PrEvKb)

---

<div class="post-metadata">

**Author:** ![fullofstaff](https://avatars.discourse-cdn.com/v4/letter/f/85f322/32.png) [@fullofstaff](https://discourse.threejs.org/u/fullofstaff)\
**Post date:** [July 6, 2019, 2:43pm UTC](https://discourse.threejs.org/t/move-the-camera-forward-in-the-direction-its-facing/8364/10 "2019-07-06T14:43:23Z")

</div>

thanks for the help found the solution  
using camera.translateZ( distance );  
fix it , now is going the right direction