# Change orbit control rotation axis with respect to Z axis upward

**URL:** <https://discourse.threejs.org/t/change-orbit-control-rotation-axis-with-respect-to-z-axis-upward/7266>\
**Category:** Questions\
**Tags:** orbit-controls\
**Created:** [April 27, 2019, 1:10pm UTC](https://discourse.threejs.org/t/change-orbit-control-rotation-axis-with-respect-to-z-axis-upward/7266 "2019-04-27T13:10:34Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![milind\_anantwar](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/milind_anantwar/32/5281_2.png) [@milind\_anantwar](https://discourse.threejs.org/u/milind_anantwar)\
**Post date:** [April 27, 2019, 1:10pm UTC](https://discourse.threejs.org/t/change-orbit-control-rotation-axis-with-respect-to-z-axis-upward/7266/1 "2019-04-27T13:10:34Z")

</div>

I have created a grid as a base ground for my scene. I am rotating the grid axis as following to have perspective of x and y on horizontal plain and z in upward and downward direction.

```
var gridGround = new THREE.GridHelper(1000, 30,0x3f3f3f, 0x3f3f3f);
gridGround.rotation.x = Math.PI/2;

```

I am using perspective camera along with orbitcontrol for allowing user to navigate in scene. However i am not able to change the rotation axis wrt change in perspective i have made above. I have tried using camera.up.set(0,0,1); but its not working.

Any help would be great.

---

<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:** [April 27, 2019, 3:30pm UTC](https://discourse.threejs.org/t/change-orbit-control-rotation-axis-with-respect-to-z-axis-upward/7266/2 "2019-04-27T15:30:51Z")

</div>

You mean a setup like this? [Edit fiddle - JSFiddle - Code Playground](https://jsfiddle.net/3p6e8xdL/2/)

> [@milind\_anantwar](#):
>
> However i am not able to change the rotation axis wrt change in perspective i have made above.

Can you please elaborate in more detail what you want to achieve? The orbit axis is derived from `camera.up`. When setting it to `(0,0,1)`, the controls seems to behave as expected.

---

<div class="post-metadata">

**Author:** ![Comawhite](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/comawhite/32/10464_2.png) [@Comawhite](https://discourse.threejs.org/u/Comawhite)\
**Post date:** [April 18, 2020, 12:55am UTC](https://discourse.threejs.org/t/change-orbit-control-rotation-axis-with-respect-to-z-axis-upward/7266/3 "2020-04-18T00:55:47Z")

</div>

Hello I have also an issue, very similar I think:  
In the fiddle, with camera up 0,0,1, press right click and try to move the camera up/down. That will move over x/y plane instead of z (z is my vertical axis). But left/right span and rotate are working fine.

If i set camera.up to 1,0,0 it’s almost ok for the vertical span, but the mouse is inverted (moving mouse up will lower the camera).  
Also the rotation is not so good with 1,0,0. What I would like to get, is a camera that acts exactly like in three.js editor.

Can somebody help me with that?