How to wrap with circular motion

Processing Coding Questions
1

Hi there,

I’m trying to get this circular motion to bound off the border of my container (wrap I think) how would I go about that?

Thanks,
Lena

float x;
float y;
float x1;
float y1;
float x2;
float y2;
//float = decimal number
float angle;
float axis_x;
float axis_y;
float radius;

float speed_x;
float direction_x;

float speed_y;
float direction_y;

void setup(){
  size(600,600);
  background(255);
  
  axis_x = 10;
  axis_y = 10;
  
  angle = 0.01;
  
  x = 0;
  y = 0;
  
  x1 = 0;
  y1 = 0;
  x2 = 0;
  y2 = 0;
  
  frameRate(120);
  
}

void update(){
  
  angle = angle + .1;
  
  //add slope (linear motion) = compound motion
  x2 = x2 + 1;
  y2 = y2 * 1; 
 

}

void draw(){
  
  //background (255);
  update();
  
 radius = (x1 + 1);
 radius = (x2 + 1);
 radius = (y1 + 1);
 radius = (y2 + 1);
 
 //calculation of angles
 x1 = 1 + cos(angle * .01) * 1.5 * TWO_PI;
 y1 = 300 + sin(angle * 20) * 1.5 * TWO_PI;
  
  //calculate x
  x = x1 + x2;
  y = y1 + y2;
  
  //render
  fill(255,0,0);
  noStroke();
  ellipse(x,y,5,5);
  
}

  void keyPressed (){
 if(key == 'x') saveFrame("check_in_05_Lena_####.png"); 
  
}
2

its not very elegant, since controlling the angle to bounce off depends on 2 variables.

however: instead of using an absolute number, use a variable that you change when you reach the edge

  x2 = x2 + 1;
  y2 = y2 * 1;

replace 1 with addX and addY

say something like:

 if (x>=width) { 
addX *= -1;
}

in this case your motion will change 180°

since you are not changing y2 it does not much I guess.

but a next step could be to bounce of at an angle, for which you calculate addX and addY accordingly.

so addX = 1 and addY = 1 will move 45°

and so on…

3

It doesn’t seem to be working, even though I defined and initialized it. Any idea?

float x;
float y;
float x1;
float y1;
float x2;
float y2;
//float = decimal number
float angle;
float axis_x;
float axis_y;
float radius;

float speed_x;
float direction_x;

float speed_y;
float direction_y;

float addX;
float addY;

void setup(){
  size(600,600);
  background(255);
  
  axis_x = 10;
  axis_y = 10;
  
  angle = 0.01;
  
  x = 0;
  y = 0;
  
  x1 = 0;
  y1 = 0;
  x2 = 0;
  y2 = 0;
  
  addX = 1;
  addY = 1;
  
  
  frameRate(120);
  
}

void update(){
  
  if (x>=width) addX *= 1;
  if (y>=width) addY *= 1;
  
  angle = angle + .1;
  
  //add slope (linear motion) = compound motion
  
  x2 = x2 + 1;
  y2 = y2 * 1; 
  
}


void draw(){
  
  //background (255);
  update();
  
 radius = (x1 + 1);
 radius = (x2 + 1);
 radius = (y1 + 1);
 radius = (y2 + 1);
 
 //calculation of angles
 x1 = 1 + cos(angle * .01) * 1.5 * TWO_PI;
 y1 = 300 + sin(angle * 20) * 1.5 * TWO_PI;
  

  
  //calculate x
  x = x1 + x2;
  y = y1 + y2;
  
  //render
  fill(255,0,0);
  noStroke();
  ellipse(x,y,5,5);
  
}
4

yes, but you make no use of it anywhere…

update should look like this:

 void update(){  
  if (x>=width) addX *= -1;  // multiply with -1 -> if addX is 1 it will become -1, if its -1 it will become 1
                             // that way you toggle between two directions
  if (y>=height) addY *= -1;  // same here, but y is for height...
  angle = angle + .1;  
  //add slope (linear motion) = compound motion  
  x2 = x2 + addX; // now USE addX instead of a number - so it either grows or shrinks
  y2 = y2 + addY; // same here  
}