# Rotate object according to camera movement

**URL:** <https://forum.8thwall.com/t/rotate-object-according-to-camera-movement/3326>\
**Category:** Technical Support\
**Tags:** FAQ, general\
**Created:** [October 28, 2024, 6:10am UTC](https://forum.8thwall.com/t/rotate-object-according-to-camera-movement/3326 "2024-10-28T06:10:15Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![Things\_That\_Move](https://avatars.discourse-cdn.com/v4/letter/t/3d9bf3/32.png) [@Things\_That\_Move](https://forum.8thwall.com/u/Things_That_Move)\
**Post date:** [October 28, 2024, 6:10am UTC](https://forum.8thwall.com/t/rotate-object-according-to-camera-movement/3326/1 "2024-10-28T06:10:15Z")

</div>

Hi there! I would like to rotate my object according to the camera movement like this demo here, so it will always be facing the user.

> **[The Thinker AR - Demo World Tracking | ICON XR Studios | 8th Wall](https://www.8thwall.com/iconxrstudios/thinker)**
>
> Experience immersive learning with Thinker AR, the app that turns your surroundings into an interactive knowledge space. Explore, learn, and connect

Is there any way I can make this possible?

---

<div class="post-metadata">

**Author:** ![GeorgeButler](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.8thwall.com/georgebutler/32/1903_2.png) [@GeorgeButler](https://forum.8thwall.com/u/GeorgeButler)\
**Post date:** [October 28, 2024, 4:23pm UTC](https://forum.8thwall.com/t/rotate-object-according-to-camera-movement/3326/2 "2024-10-28T16:23:27Z")

</div>

If you’re using Cloud Editor you can add the [xr-extras manipulate components](https://github.com/8thwall/web/tree/master/examples/aframe/manipulate) to your entity.

If you’re using Niantic Studio, you could add a “Look At” animation component that is set to look at the camera.

---

<div class="post-metadata">

**Author:** ![Things\_That\_Move](https://avatars.discourse-cdn.com/v4/letter/t/3d9bf3/32.png) [@Things\_That\_Move](https://forum.8thwall.com/u/Things_That_Move)\
**Post date:** [October 29, 2024, 2:54am UTC](https://forum.8thwall.com/t/rotate-object-according-to-camera-movement/3326/3 "2024-10-29T02:54:08Z")

</div>

Thank you so much on the reply! I am currently using Cloud Editor and I have studied around the xrextras manipulate components but I am still not sure what I should use so I can only change the rotation of the object to “look at” the camera… 😭

---

<div class="post-metadata">

**Author:** ![GeorgeButler](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.8thwall.com/georgebutler/32/1903_2.png) [@GeorgeButler](https://forum.8thwall.com/u/GeorgeButler)\
**Post date:** [October 29, 2024, 4:35pm UTC](https://forum.8thwall.com/t/rotate-object-according-to-camera-movement/3326/4 "2024-10-29T16:35:44Z")

</div>

If you just want the object to “look at” the camera you can use this custom component I found:

> **[aframe-look-at-component](https://www.npmjs.com/package/aframe-look-at-component?activeTab=code)**
>
> Rotate an entity to face towards another entity in A-Frame. Latest version: 1.0.0, last published: 4 years ago. Start using aframe-look-at-component in your project by running \`npm i aframe-look-at-component\`. There are 9 other projects in the npm...

You’ll need to put the component registration into your app.js and then you can use it in your body.html.

---

<div class="post-metadata">

**Author:** ![Things\_That\_Move](https://avatars.discourse-cdn.com/v4/letter/t/3d9bf3/32.png) [@Things\_That\_Move](https://forum.8thwall.com/u/Things_That_Move)\
**Post date:** [November 4, 2024, 8:53am UTC](https://forum.8thwall.com/t/rotate-object-according-to-camera-movement/3326/5 "2024-11-04T08:53:13Z")

</div>

Thank you for another great solution! I have tried this but this is not exactly what I want to achieve. I want my marker object can rotate along with the camera so it is always parallel with the user’s perspective but still can go near and far according to user’s phone orientation like the example above. The look at component stuck my marker on the screen. It was my mistake that I didn’t explain clearly.

---

<div class="post-metadata">

**Author:** ![Evan](https://sea1.discourse-cdn.com/flex019/user_avatar/forum.8thwall.com/evan/32/431_2.png) [@Evan](https://forum.8thwall.com/u/Evan)\
**Post date:** [November 4, 2024, 12:02pm UTC](https://forum.8thwall.com/t/rotate-object-according-to-camera-movement/3326/6 "2024-11-04T12:02:24Z")

</div>

It sounds like you want to use the look-at component, but disable rotation on the Y axis - is that correct? Check out this sample project:

> **[Green Screen Video + World Tracking | 8th Wall Playground | 8th Wall](https://www.8thwall.com/playground/alpha-video-slam-aframe/code/)**
>
> Example of a green screen video placed on a surface using SLAM.

If you want to achieve the same functionality, you can use our [custom look-at component](https://www.8thwall.com/playground/alpha-video-slam-aframe/code/look-at.js) which disables Y rotation by default.

---

<div class="post-metadata">

**Author:** ![Things\_That\_Move](https://avatars.discourse-cdn.com/v4/letter/t/3d9bf3/32.png) [@Things\_That\_Move](https://forum.8thwall.com/u/Things_That_Move)\
**Post date:** [November 5, 2024, 3:30am UTC](https://forum.8thwall.com/t/rotate-object-according-to-camera-movement/3326/7 "2024-11-05T03:30:04Z")

</div>

Oh my god!!! This is exactly what I wanted to do! Thank you so much for the help!!

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex019/uploads/x8thwall/original/2X/9/9212a857458f1b03a6accb129e0f8cbea408e3e5.png) [@system](https://forum.8thwall.com/u/system)\
**Post date:** [November 9, 2024, 3:30am UTC](https://forum.8thwall.com/t/rotate-object-according-to-camera-movement/3326/8 "2024-11-09T03:30:36Z")

</div>

This topic was automatically closed 4 days after the last reply. New replies are no longer allowed.
