# Camera.rotation.y flipping

**URL:** <https://discourse.threejs.org/t/camera-rotation-y-flipping/24869>\
**Category:** Questions\
**Tags:** rotation, quaternion\
**Created:** [March 29, 2021, 10:49am UTC](https://discourse.threejs.org/t/camera-rotation-y-flipping/24869 "2021-03-29T10:49:22Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![lmffx](https://avatars.discourse-cdn.com/v4/letter/l/ba9def/32.png) [@lmffx](https://discourse.threejs.org/u/lmffx)\
**Post date:** [March 29, 2021, 10:49am UTC](https://discourse.threejs.org/t/camera-rotation-y-flipping/24869/1 "2021-03-29T10:49:22Z")

</div>

Hello,  
I am trying to place an object in front of my camera, facing the camera.  
The object should be placed 1.1m in front of, and 0.4m under the camera’s position.  
The object should not get tilted by the cameras rotation, and always have it’s up-vector in the Vector3.up direction.

This is what I have currently:  
I placed the obj at camera.position. Then I rotated it at y-axis to face the same direction as the camera. After that I translated the object in this direction.

```
obj.position.set(camera.position.x, camera.position.y, camera.position.z);
obj.rotation.set(0, camera.rotation.y, 0);
obj.translateZ(-1.1);
obj.translateY(-0.4);

```

This works, but only if the y-rotation of the camera is between 90 and -90 degrees.  
If the camera’s rotation is something like 110 degrees, the object gets placed at 70 degrees instead of 110.

So the mistake is probaly in this line:

```javascript
obj.rotation.set(0, camera.rotation.y, 0);

```

How can I get the ‘real’ y-axis rotation of the camera (0-360) degrees?

---

<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:** [March 29, 2021, 2:10pm UTC](https://discourse.threejs.org/t/camera-rotation-y-flipping/24869/2 "2021-03-29T14:10:20Z")

</div>

Is your use case related to the following topic?

> [@Plane always look into camera](https://discourse.threejs.org/t/plane-always-look-into-camera/4000):
>
> Is there a way to make a plane always face into camera/screen direction just like an billboard?

---

<div class="post-metadata">

**Author:** ![lmffx](https://avatars.discourse-cdn.com/v4/letter/l/ba9def/32.png) [@lmffx](https://discourse.threejs.org/u/lmffx)\
**Post date:** [March 29, 2021, 2:50pm UTC](https://discourse.threejs.org/t/camera-rotation-y-flipping/24869/3 "2021-03-29T14:50:31Z")

</div>

Yes kind off. But I am only interrested in rotation.y, the object I am rotating should not get tilted in any way, and only rotated around y-axis.  
But whenever I set rotation.x and rotation.z to 0, the y-rotation flips at 180 degrees

---

<div class="post-metadata">

**Author:** ![alessandro\_guarino](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/alessandro_guarino/32/16309_2.png) [@alessandro\_guarino](https://discourse.threejs.org/u/alessandro_guarino)\
**Post date:** [March 29, 2021, 2:51pm UTC](https://discourse.threejs.org/t/camera-rotation-y-flipping/24869/4 "2021-03-29T14:51:08Z")

</div>

could this solution work too? …Parent the object to the camera  
camera.add(obj);  
… No  
sorry I didn’t understood

---

<div class="post-metadata">

**Author:** ![lmffx](https://avatars.discourse-cdn.com/v4/letter/l/ba9def/32.png) [@lmffx](https://discourse.threejs.org/u/lmffx)\
**Post date:** [March 29, 2021, 2:55pm UTC](https://discourse.threejs.org/t/camera-rotation-y-flipping/24869/5 "2021-03-29T14:55:22Z")

</div>

Not in my case I think. I don’t want the object to move with the camera, but I want to place it in front of the camera at a certain time.

To give some context: I’m working on an AR app, and want to place the Object in front of the camera, when the user taps the screen. The object’s position should be 1.1m away, and 0.4m under the camera’s position. Also, the object should be facing to the camera, only be rotated around y-axis.

But at the moment, this only works, if the user doesn’t turn around with his phone more than 90 degrees. After +90 or -90 degrees, the y-rotation of the camera flips, resulting in the object not being placed in front of the camera anymore.

---

<div class="post-metadata">

**Author:** ![Lawrence3DPK](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/lawrence3dpk/32/29184_2.png) [@Lawrence3DPK](https://discourse.threejs.org/u/Lawrence3DPK)\
**Post date:** [March 30, 2021, 11:51pm UTC](https://discourse.threejs.org/t/camera-rotation-y-flipping/24869/6 "2021-03-30T23:51:09Z")

</div>

If(camera.rotation.y \>= 90\*Math.PI/180){ obj.rotation.y = -camera.rotation.y}

Same for \< - 90

? Possibly, untested 🙂

---

<div class="post-metadata">

**Author:** ![sylwesterdigital](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/sylwesterdigital/32/11792_2.png) [@sylwesterdigital](https://discourse.threejs.org/u/sylwesterdigital)\
**Post date:** [November 1, 2021, 6:19pm UTC](https://discourse.threejs.org/t/camera-rotation-y-flipping/24869/7 "2021-11-01T18:19:04Z")

</div>

I had similar issue, solved by setting object.eulerOrder = ‘ZYX’ and camera.eulerOrder = ‘YXZ’. I would spend ages studying this issue by reading Primer Books suggested by Mugen87

---

<div class="post-metadata">

**Author:** ![Santhosh\_Reddy](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/santhosh_reddy/32/24394_2.png) [@Santhosh\_Reddy](https://discourse.threejs.org/u/Santhosh_Reddy)\
**Post date:** [March 3, 2022, 7:23am UTC](https://discourse.threejs.org/t/camera-rotation-y-flipping/24869/9 "2022-03-03T07:23:59Z")

</div>

This sloved my issue… thanks a lot 🙂