# Direct orthonormed system

**URL:** https://discourse.processing.org/t/direct-orthonormed-system/2529
**Category:** Project Guidance
**Created:** [August 10, 2018, 11:54am UTC](https://discourse.processing.org/t/direct-orthonormed-system/2529 "2018-08-10T11:54:37Z")
**Posts on this page:** 6
**Page:** 1

<div class="post-metadata">

### Author: ![theo](https://avatars.discourse-cdn.com/v4/letter/t/a87d85/32.png) [@theo](https://discourse.processing.org/u/theo)
#### Post date: [August 10, 2018, 11:54am UTC](https://discourse.processing.org/t/direct-orthonormed-system/2529/1 "2018-08-10T11:54:37Z")

</div>

Hello,

By default the origin is in the top left corner, the x axis is pointing on the right and the y axis down.  
Is it possible to get a “common” coordinate system (like the one usually used in math: origin bottom right corner, x axis pointing right and y axis pointing up)

I know the scale, rotate and translate function but my main problem is that I can’t scale the y axis by -1…

Thanks.

---

<div class="post-metadata">

### Author: ![jb4x](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/jb4x/32/789_2.png) [@jb4x](https://discourse.processing.org/u/jb4x)
#### Post date: [August 10, 2018, 12:18pm UTC](https://discourse.processing.org/t/direct-orthonormed-system/2529/2 "2018-08-10T12:18:42Z")

</div>

You can create a function that return the pixel coordinate based on your orthonormal system.

Let’s say you want your system to be

- 0 in the bottom left
- xMax in the bottom right
- yMax in the top left

Then a point (x, y) in your system would become ( (width / xMax) \* x, - (heigth / yMax) \* y) in the screen coordinate.

---

<div class="post-metadata">

### Author: ![hamoid](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/hamoid/32/58_2.png) [@hamoid](https://discourse.processing.org/u/hamoid)
#### Post date: [August 10, 2018, 1:41pm UTC](https://discourse.processing.org/t/direct-orthonormed-system/2529/3 "2018-08-10T13:41:17Z")

</div>

Why can’t you scale the y axis? It doesn’t work? Or your program should not do that?

```auto
translate(0, 100);
scale(1, -1);
rect(0, 0, 50, 50);

```

---

<div class="post-metadata">

### Author: ![theo](https://avatars.discourse-cdn.com/v4/letter/t/a87d85/32.png) [@theo](https://discourse.processing.org/u/theo)
#### Post date: [August 10, 2018, 3:48pm UTC](https://discourse.processing.org/t/direct-orthonormed-system/2529/4 "2018-08-10T15:48:01Z")

</div>

Ho! I never thought to it, this is a great idea, thank you jb4x

---

<div class="post-metadata">

### Author: ![theo](https://avatars.discourse-cdn.com/v4/letter/t/a87d85/32.png) [@theo](https://discourse.processing.org/u/theo)
#### Post date: [August 10, 2018, 3:54pm UTC](https://discourse.processing.org/t/direct-orthonormed-system/2529/5 "2018-08-10T15:54:30Z")

</div>

hamoid, I tried to scale the y axis by -1 and translate but when I tried to draw sth, it was like if it didn’t work…  
I will try again and informed you.

---

<div class="post-metadata">

### Author: ![ProcessingOrg](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/processingorg/32/18341_2.png) [@ProcessingOrg](https://discourse.processing.org/u/ProcessingOrg)
#### Post date: [August 10, 2018, 6:48pm UTC](https://discourse.processing.org/t/direct-orthonormed-system/2529/6 "2018-08-10T18:48:30Z")

</div>

Here’s a more complete example to show @hamoid’s idea:

```auto
void setup() {
  size(400, 400); 
}

void draw() {
  background(204);
  translate(0, height);
  scale(1, -1);
  ellipse(0, 0, 50, 50);
  ellipse(200, 200, 100, 100);
  ellipse(200, 300, 10, 10);
}

```
