# Moving ellipse to opposite side of canvas

**URL:** https://discourse.processing.org/t/moving-ellipse-to-opposite-side-of-canvas/35517
**Category:** Coding Questions
**Created:** [March 2, 2022, 11:47am UTC](https://discourse.processing.org/t/moving-ellipse-to-opposite-side-of-canvas/35517 "2022-03-02T11:47:59Z")
**Posts on this page:** 5
**Page:** 1

<div class="post-metadata">

### Author: ![processingArthur](https://avatars.discourse-cdn.com/v4/letter/p/b5ac83/32.png) [@processingArthur](https://discourse.processing.org/u/processingArthur)
#### Post date: [March 2, 2022, 11:47am UTC](https://discourse.processing.org/t/moving-ellipse-to-opposite-side-of-canvas/35517/1 "2022-03-02T11:47:59Z")

</div>

Hi. I was wondering how I can make a moving ellipse reappear on the opposite side of the canvas when it reaches the edge. I understand how to get it to reappear on the x axis and y axis individually ie if the xpos is greater than width, make xpos equal zero. but I am not sure how to move it to the opposite side if it is moving in a diagonal direction.

Any suggestions would be amazing! Thanks!

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [March 2, 2022, 12:04pm UTC](https://discourse.processing.org/t/moving-ellipse-to-opposite-side-of-canvas/35517/2 "2022-03-02T12:04:30Z")

</div>

It should work independently.

like

- if the xpos is greater than width, make xpos equal zero
- if the ypos is greater than height, make ypos equal zero

(and vice versa)

---

<div class="post-metadata">

### Author: ![processingArthur](https://avatars.discourse-cdn.com/v4/letter/p/b5ac83/32.png) [@processingArthur](https://discourse.processing.org/u/processingArthur)
#### Post date: [March 2, 2022, 12:09pm UTC](https://discourse.processing.org/t/moving-ellipse-to-opposite-side-of-canvas/35517/3 "2022-03-02T12:09:39Z")

</div>

That doesnt seem to work though… It seems to come out the other side as random. I used

```auto
    if (xPos > width) {
      xPos=0;
    }
    if (xPos < 0) {
      xPos= width;
    }
    if (yPos <0) {
      yPos=height;
    }
    if (yPos > height) {
      yPos=0;
    }

```

---

<div class="post-metadata">

### Author: ![Chrisir](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/chrisir/32/45_2.png) [@Chrisir](https://discourse.processing.org/u/Chrisir)
#### Post date: [March 2, 2022, 12:14pm UTC](https://discourse.processing.org/t/moving-ellipse-to-opposite-side-of-canvas/35517/4 "2022-03-02T12:14:14Z")

</div>

looks good to me

can you post an example that is runnable / entire code?

here is my version (with your code!). It works.

It’s not random it just changes the xPos or yPos to 0. Without changing the other value (in most cases) and without changing the direction.

Can you explain what you think is random?

Warm regards,

Chrisir

```auto
float xPos, yPos;
float xAdd=2, yAdd=3;

void setup() {
  size(600, 600);
}

void draw() {
  background(0);

  ellipse(xPos, yPos, 25, 25); 

  if (xPos > width) {
    xPos=0;
  }
  if (xPos < 0) {
    xPos= width;
  }
  if (yPos <0) {
    yPos=height;
  }
  if (yPos > height) {
    yPos=0;
  }

  // move
  xPos+=xAdd;
  yPos+=yAdd;
}

```

---

<div class="post-metadata">

### Author: ![glv](https://yyz2.discourse-cdn.com/flex036/user_avatar/discourse.processing.org/glv/32/18785_2.png) [@glv](https://discourse.processing.org/u/glv)
#### Post date: [March 2, 2022, 11:17pm UTC](https://discourse.processing.org/t/moving-ellipse-to-opposite-side-of-canvas/35517/5 "2022-03-02T23:17:34Z")

</div>

Hello @processingArthur,

Example:

```auto
void setup()
  {
  size(300, 300);
  }
  
void draw()
  {
  background(255);  
  translate(width/2, height/2); //Comment this and adjust code 
  circle(0, 0, 10); // Origin (0, 0);
  
  println(mouseX, mouseY);
  
  int x = mouseX - width/2;
  int y = mouseY - height/2;
  
  circle(x, y, 10); 
  circle(-x, -y, 10);
  }

```

I cooked this up to show someone here where the opposite is and they were delighted with the outcome.

![image](https://canada1.discourse-cdn.com/flex036/uploads/processingfoundation1/original/2X/d/da897d22e933f6b3d5db7894dec93c09ceca832c.png)

`:)`
