# How to rotate model?

**URL:** <https://discourse.threejs.org/t/how-to-rotate-model/8592>\
**Category:** Questions\
**Tags:** controls\
**Created:** [July 18, 2019, 9:51pm UTC](https://discourse.threejs.org/t/how-to-rotate-model/8592 "2019-07-18T21:51:50Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![threejs](https://avatars.discourse-cdn.com/v4/letter/t/7bcc69/32.png) [@threejs](https://discourse.threejs.org/u/threejs)\
**Post date:** [July 18, 2019, 9:51pm UTC](https://discourse.threejs.org/t/how-to-rotate-model/8592/1 "2019-07-18T21:51:50Z")

</div>

Hello. I’m a beginner in threeJS and i have problem. I try add model with controls. I loaded model (fbx) and i added to this model controls with the help of other examples. Everything is fine but i must rotation model. Model is forward to camera and the camera follows the model so the model still moves backwards. And how rotation this model (180 degrees), i tried several ways but without effect ☹  
This is code: [https://jsfiddle.net/b12p0efu/1/](https://jsfiddle.net/b12p0efu/1/)

---

<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 19, 2019, 9:48am UTC](https://discourse.threejs.org/t/how-to-rotate-model/8592/2 "2019-07-19T09:48:48Z")

</div>

Can you also share a workable fiddle? It seems you just copy/pasted over your code. For instance the paths to your libraries and assets are obviously wrong.

---

<div class="post-metadata">

**Author:** ![threejs](https://avatars.discourse-cdn.com/v4/letter/t/7bcc69/32.png) [@threejs](https://discourse.threejs.org/u/threejs)\
**Post date:** [July 19, 2019, 9:19pm UTC](https://discourse.threejs.org/t/how-to-rotate-model/8592/3 "2019-07-19T21:19:10Z")

</div>

Oh yea sorry: [https://jsfiddle.net/0ubsrkqo/](https://jsfiddle.net/0ubsrkqo/)  
I use cube instead model because i had a problem with load model on jsfiddle ( Access-Control-Allow-Origin). And frontside is blue (this is front of model) and i want to rotation cube (is model “Alien”) 180 deegres that model will be back to camera, and thanks to them controls will be correctly, because now model still moves backwards. Frontside of cube is green and it should be to front of camera, then everything would work properly.

---

<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 20, 2019, 1:53pm UTC](https://discourse.threejs.org/t/how-to-rotate-model/8592/4 "2019-07-20T13:53:34Z")

</div>

Um, I’m not sure I understand your issue. Why don’t you just use an ordinary scene setup with `OrbitControls` like so:

[https://jsfiddle.net/ht1wmLrc/1/](https://jsfiddle.net/ht1wmLrc/1/)

That’s similar to most official three.js examples.

---

<div class="post-metadata">

**Author:** ![threejs](https://avatars.discourse-cdn.com/v4/letter/t/7bcc69/32.png) [@threejs](https://discourse.threejs.org/u/threejs)\
**Post date:** [July 20, 2019, 4:26pm UTC](https://discourse.threejs.org/t/how-to-rotate-model/8592/5 "2019-07-20T16:26:36Z")

</div>

I want to get effect like this: [http://collinhover.github.io/kaiopua/](http://collinhover.github.io/kaiopua/)  
But my model: [https://imgur.com/qI2GS2b](https://imgur.com/qI2GS2b)  
Camera follows the model and model moves backwards: [https://imgur.com/a/t6V1oeb](https://imgur.com/a/t6V1oeb)  
So I need to rotate the model.  
Your solution is ok, but the camera has to follow the model.  
For example like this: [https://threejs.org/examples/#webgl\_loader\_md2\_control](https://threejs.org/examples/#webgl_loader_md2_control)

---

<div class="post-metadata">

**Author:** ![Usnul](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/usnul/32/2355_2.png) [@Usnul](https://discourse.threejs.org/u/Usnul)\
**Post date:** [July 21, 2019, 1:51pm UTC](https://discourse.threejs.org/t/how-to-rotate-model/8592/6 "2019-07-21T13:51:14Z")

</div>

@threejs

Hey, welcome threejs! You linked the example that you want to imitate, that’s great, since @Mugen87’s work is “ok” - I understand that it’s not great, not sufficient at any rate. Now you found something that is - just dig into the example code and work from there.

Did you know that all of the examples have source code available for free? Better yet, there’s a button in the bottom right corner that will take you straight to the code!

 ![image](https://canada1.discourse-cdn.com/flex035/uploads/threejs/original/2X/d/de8325ff581587e4c4a97a2abdbcf653b2d173e4.jpeg)

With a name like yours, I expect amazing things in your future, good luck! 😉

---

<div class="post-metadata">

**Author:** ![ramzan](https://avatars.discourse-cdn.com/v4/letter/r/8baadc/32.png) [@ramzan](https://discourse.threejs.org/u/ramzan)\
**Post date:** [November 1, 2021, 5:53pm UTC](https://discourse.threejs.org/t/how-to-rotate-model/8592/7 "2021-11-01T17:53:18Z")

</div>

I want to rotate model from left to right up to down in a circle form can someone help

---

<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:** [November 1, 2021, 6:55pm UTC](https://discourse.threejs.org/t/how-to-rotate-model/8592/8 "2021-11-01T18:55:18Z")

</div>

The circle form has a simple formula.  
In the [Collection of examples from discourse.threejs.org](https://discourse.threejs.org/t/collection-of-examples-from-discourse-threejs-org/4315) you will find even more complicated movements.

[BeginnerExample](https://hofk.de/main/discourse.threejs/BeginnerExample/BeginnerExample.html) step 15

[3DReducedTextGeometry](https://hofk.de/main/discourse.threejs/2019/3DReducedTextGeometry/3DReducedTextGeometry.html)  
[SmoothTurnsToPath](https://hofk.de/main/discourse.threejs/2019/SmoothTurnsToPath/SmoothTurnsToPath.html)  
[LoadGLTFmove](https://hofk.de/main/discourse.threejs/2020/LoadGLTF/LoadGLTF.html)

[BasisToQuaternion](https://hofk.de/main/discourse.threejs/2021/BasisToQuaternion/BasisToQuaternion.html)  
[MotionAlongCurve](https://hofk.de/main/discourse.threejs/2021/MotionAlongCurve/MotionAlongCurve.html)  
[RotationToTargetObject](https://hofk.de/main/discourse.threejs/2021/RotationToTargetObject/RotationToTargetObject.html)

🙂