# How to change the default coordinate axes to Z-UP

**URL:** <https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692>\
**Category:** Questions\
**Tags:** coordinate-system\
**Created:** [January 16, 2022, 1:09pm UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692 "2022-01-16T13:09:04Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![Babak](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/babak/32/19613_2.png) [@Babak](https://discourse.threejs.org/u/Babak)\
**Post date:** [January 16, 2022, 1:09pm UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692/1 "2022-01-16T13:09:04Z")

</div>

I am working in new 3d editor for printing systems based on the [threeJs editor](https://threejs.org/editor/) but there is a needed to change default coordinate system from y-up to z-up. By searching in communities found some snippet code to implement that:

```javascript
camera.up.set(0, 0, 1);

```

and rotate grid 90 ْ :

```javascript
grid.rotateX(Math.PI / 2);

```

That’s work but occurs other problems:

1. Cannot drag 360 ْ up-down it’s limited to 180 ْ
2. Grid does not move in the same direction as the mouse drag for example you drag from left to right but grid revolves in up-down by some angle

How can i solve this issue?

---

<div class="post-metadata">

**Author:** ![awonnink](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/awonnink/32/22486_2.png) [@awonnink](https://discourse.threejs.org/u/awonnink)\
**Post date:** [January 16, 2022, 4:29pm UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692/2 "2022-01-16T16:29:15Z")

</div>

Can you perhaps work with eulerOrder, something like

> camera.eulerOrder = “XZY”;

?

---

<div class="post-metadata">

**Author:** ![Babak](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/babak/32/19613_2.png) [@Babak](https://discourse.threejs.org/u/Babak)\
**Post date:** [January 16, 2022, 5:45pm UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692/3 "2022-01-16T17:45:33Z")

</div>

That’s not worked.

> camera.eulerOrder = “XZY”;

I think it isn’t camera property !

---

<div class="post-metadata">

**Author:** ![awonnink](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/awonnink/32/22486_2.png) [@awonnink](https://discourse.threejs.org/u/awonnink)\
**Post date:** [January 16, 2022, 6:44pm UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692/4 "2022-01-16T18:44:44Z")

</div>

It is a property of the Object3d and as such for the camera, and had helped me resolving a camera rotation issue (deprecating, now apparently ‘object.rotation.order’) . But you’re right, it is only for applying rotations using Euler, it doesn’t really effect the coordinate system when setting positions. My bad.

---

<div class="post-metadata">

**Author:** ![malik\_shoeb](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/malik_shoeb/32/39547_2.png) [@malik\_shoeb](https://discourse.threejs.org/u/malik_shoeb)\
**Post date:** [March 4, 2024, 11:35am UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692/6 "2024-03-04T11:35:24Z")

</div>

@Babak, did you find any solution for the above issue ? If yes, Can you please share it here ?

---

<div class="post-metadata">

**Author:** ![n1ka](https://avatars.discourse-cdn.com/v4/letter/n/db5fbb/32.png) [@n1ka](https://discourse.threejs.org/u/n1ka)\
**Post date:** [June 3, 2024, 8:36am UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692/7 "2024-06-03T08:36:12Z")

</div>

how to solve this problem？

---

<div class="post-metadata">

**Author:** ![mjurczyk](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/mjurczyk/32/10995_2.png) [@mjurczyk](https://discourse.threejs.org/u/mjurczyk)\
**Post date:** [June 3, 2024, 9:12am UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692/8 "2024-06-03T09:12:30Z")

</div>

Depends on what you need the rotated axes for - for 3D printing it should be as simple as rotating the entire scene 90 degrees around the X or Z axis before exporting the model for printing.

---

<div class="post-metadata">

**Author:** ![n1ka](https://avatars.discourse-cdn.com/v4/letter/n/db5fbb/32.png) [@n1ka](https://discourse.threejs.org/u/n1ka)\
**Post date:** [June 4, 2024, 5:44am UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692/10 "2024-06-04T05:44:39Z")

</div>

OK, i solve this problem, you must init camera before orbitcontrols.

---

<div class="post-metadata">

**Author:** ![n1ka](https://avatars.discourse-cdn.com/v4/letter/n/db5fbb/32.png) [@n1ka](https://discourse.threejs.org/u/n1ka)\
**Post date:** [June 4, 2024, 5:44am UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692/11 "2024-06-04T05:44:53Z")

</div>

> [@Problem about rotation in orbitControls and camera up property](https://discourse.threejs.org/t/problem-about-rotation-in-orbitcontrols-and-camera-up-property/52414):
>
> Description: I encountered a problem with the rotation behavior of orbitControls. When instantiating orbitControls without setting the camera’s “up” property correctly, the rotation behaves incorrectly (the camera rotates in a wavy pattern when the mouse moves horizontally). Even if I update the orbit and camera information after instantiation, the rotation remains incorrect. However, if I set the camera’s “up” property before instantiating orbitControls, the rotation behaves correctly. The …

---

<div class="post-metadata">

**Author:** ![manthrax](https://yyz1.discourse-cdn.com/flex035/user_avatar/discourse.threejs.org/manthrax/32/2596_2.png) [@manthrax](https://discourse.threejs.org/u/manthrax)\
**Post date:** [June 4, 2024, 7:02am UTC](https://discourse.threejs.org/t/how-to-change-the-default-coordinate-axes-to-z-up/33692/12 "2024-06-04T07:02:38Z")

</div>

Instead of trying to force threejs to be z-up…  
(Which is a nightmare since SOO many components assume Y-up, like orbitcontrols, environment maps, etc.)

Just put all your Z-up world underneath a new Group() that rotates -PI\*.5 on x.

```javascript
let zUpRoot = new THREE.Group();
zUpRoot.rotation.x = -Math.PI*.5;
scene.add(zUpRoot);
zUpRoot.add( yourZUpScene );

```

If you try to force three to be z-up, it’s possible, but you will end up repairing things every time you encounter a new component that assumes y-up. So… it is possible, but you may end up cursing yourself for your decision.