# How to rotate camera from worldDirection to another vector without lookAt method

**URL:** <https://discourse.threejs.org/t/how-to-rotate-camera-from-worlddirection-to-another-vector-without-lookat-method/46206>\
**Category:** Questions\
**Created:** [December 25, 2022, 9:04am UTC](https://discourse.threejs.org/t/how-to-rotate-camera-from-worlddirection-to-another-vector-without-lookat-method/46206 "2022-12-25T09:04:42Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![nonorganic](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/nonorganic/32/29701_2.png) [@nonorganic](https://discourse.threejs.org/u/nonorganic)\
**Post date:** [December 25, 2022, 9:04am UTC](https://discourse.threejs.org/t/how-to-rotate-camera-from-worlddirection-to-another-vector-without-lookat-method/46206/1 "2022-12-25T09:04:42Z")

</div>

I am trying to rotate camera around all axises and. lookAt methos uses camera.up vector, and when camera rotates above 180 and under -180 degress camera.up vector keep camera orientation. I expect camera works like spaceship rotation.

How to implement rotation like lookAt function?

I apply object quaternion(spaceship model) to camera. Then use lookAt method, but it works not expected when rotation around local x axis of the ship.

```javascript
    const cameraOffset = new Vector3(0, 2, 3)

    cameraOffset.applyQuaternion(this.ship.quaternion)
    cameraOffset.add(this.ship.position)

// camera position
    this.position.lerp(cameraOffset, 0.1)
    this.tjsObject.position.copy(this.position)

```

```javascript
    const cameraLookAt = new Vector3(0, 1, -5)

    cameraLookAt.applyQuaternion(this.ship.quaternion)
    cameraLookAt.add(this.ship.position)

    this.lookAt.lerp(cameraLookAt, 0.1)
    this.tjsObject.lookAt(this.lookAt)

```

---

<div class="post-metadata">

**Author:** ![ccammack](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@ccammack](https://discourse.threejs.org/u/ccammack)\
**Post date:** [December 25, 2022, 2:21pm UTC](https://discourse.threejs.org/t/how-to-rotate-camera-from-worlddirection-to-another-vector-without-lookat-method/46206/2 "2022-12-25T14:21:32Z")

</div>

Given a normalized vector to the target and [-Camera.getWorldDirection](https://threejs.org/docs/index.html?q=camera#api/en/cameras/Camera.getWorldDirection), the function [Quaternion.setFromUnitVectors](https://threejs.org/docs/index.html?q=quater#api/en/math/Quaternion.setFromUnitVectors) should create a quaternion that will perform the rotation.

---

<div class="post-metadata">

**Author:** ![nonorganic](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/nonorganic/32/29701_2.png) [@nonorganic](https://discourse.threejs.org/u/nonorganic)\
**Post date:** [December 26, 2022, 5:22am UTC](https://discourse.threejs.org/t/how-to-rotate-camera-from-worlddirection-to-another-vector-without-lookat-method/46206/3 "2022-12-26T05:22:52Z")

</div>

```javascript
  update() {
    const cameraOffset = new Vector3(0, 2, 5)
    const cameraLookAt = new Vector3(0, 1, -5)

    cameraOffset.applyQuaternion(this.ship.quaternion)
    cameraOffset.add(this.ship.position)

    cameraLookAt.applyQuaternion(this.ship.quaternion)
    cameraLookAt.add(this.ship.position)

    const f = new Vector3()
    this.tjsObject.getWorldDirection(f)

    f.normalize()
    cameraLookAt.normalize()

    const q = new Quaternion()
    q.setFromUnitVectors(f, cameraLookAt)

    // interpolate camera position
    this.position.lerp(cameraOffset, 0.1)
    this.tjsObject.position.copy(this.position)

    // interpolate camera rotation
    this.tjsObject.quaternion.slerp(q, 0.1)
  }

```

But it works like this now ☹

---

<div class="post-metadata">

**Author:** ![nonorganic](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/nonorganic/32/29701_2.png) [@nonorganic](https://discourse.threejs.org/u/nonorganic)\
**Post date:** [December 26, 2022, 9:37am UTC](https://discourse.threejs.org/t/how-to-rotate-camera-from-worlddirection-to-another-vector-without-lookat-method/46206/4 "2022-12-26T09:37:01Z")

</div>

But if i slerp to ship 3d object quaternion it works like expected, but without lookAt custom vector unfortunately.

change

```javascript
 this.tjsObject.quaternion.slerp(q, 0.1)

```

to

```javascript
this.tjsObject.quaternion.slerp(this.ship.quaternion, 0.1)

```

but as i say above there is no camera custom lookAt vector now

---

<div class="post-metadata">

**Author:** ![nonorganic](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/nonorganic/32/29701_2.png) [@nonorganic](https://discourse.threejs.org/u/nonorganic)\
**Post date:** [December 26, 2022, 12:18pm UTC](https://discourse.threejs.org/t/how-to-rotate-camera-from-worlddirection-to-another-vector-without-lookat-method/46206/5 "2022-12-26T12:18:21Z")

</div>

I think the question is how to make lookAt function without .up vector.I think cameraLookAt vector calculates properly, because with three.js lookAt function it works as expected.

---

<div class="post-metadata">

**Author:** ![ccammack](https://avatars.discourse-cdn.com/v4/letter/c/9f8e36/32.png) [@ccammack](https://discourse.threejs.org/u/ccammack)\
**Post date:** [December 26, 2022, 4:03pm UTC](https://discourse.threejs.org/t/how-to-rotate-camera-from-worlddirection-to-another-vector-without-lookat-method/46206/6 "2022-12-26T16:03:22Z")

</div>

> [@nonorganic](#):
>
> how to make lookAt function without .up vector

I don’t understand what that means. The up vector defines the object’s roll in the final orientation, so all [3d objects](https://threejs.org/docs/#api/en/core/Object3D.up) must have one.

Assuming that tjsObject is the camera, I think vector f should be negated, since cameras look out their negative z axes.

Also, cameraLookAt appears to just be a world position; you need a new normalized vector from the camera’s world position to the cameraLookAt world position called cameraLookAtDirection or something and then use that and vector f to calculate the quaternion.

It might help to add a debug orbit camera to your scene with a button to toggle between the cameras so you can drop debug axes helpers to see if your positions and rotations come out like you expect.

---

<div class="post-metadata">

**Author:** ![nonorganic](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/nonorganic/32/29701_2.png) [@nonorganic](https://discourse.threejs.org/u/nonorganic)\
**Post date:** [December 26, 2022, 4:40pm UTC](https://discourse.threejs.org/t/how-to-rotate-camera-from-worlddirection-to-another-vector-without-lookat-method/46206/7 "2022-12-26T16:40:17Z")

</div>

Thanks. I’ll try to calculate cameraLookAtDirection and rotate vector
