Moving ellipse to opposite side of canvas

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!

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)

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

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

1 Like

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

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;
}

Hello @processingArthur,

Example:

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

:)