Object follows opposite direction of mouse inside a circle

killthepixelnow

Hello again, still struggling to come up with a solution to a problem. In this sketch, I need to simulate the behavior of a goat and a mouse. The small black circle MUST be inside the circle, its position can't exceed the circle radius. At the same time, it must be in the opposite direction as the mouse, hence the idea of a goat afraid of a mouse.

This is my code at the moment:

PVector bigCircle;
PVector theMouse;
PVector theGoat;
PVector theCenter;

float theMagnitude;

void setup(){
  size(400,400);
  frameRate(30);
  smooth();
  bigCircle = new PVector();
  theMouse = new PVector();
  theGoat = new PVector();
  theCenter = new PVector();
}

void draw(){
  background(255);

  //Creating new PVectors
  bigCircle.set(280,280);
  theMouse.set(mouseX,mouseY);
  theGoat.set(15,15);
  theCenter.set(width/2,height/2);
  bigCircle.sub(theGoat); 

  //Obtaining the lenght of the vector using mag()
  theMagnitude = theCenter.dist(bigCircle);
  println(theMagnitude);

  //Drawing the goat
  fill(0);
  ellipse(theMouse.x,theMouse.y,theGoat.x,theGoat.y);

  //Drawing the big circle
  noFill();
  ellipse(width/2,height/2,bigCircle.x,bigCircle.y);
}

PhiLho

First, a little improvement over your sketch:

PVector bigCircle;
PVector theMouse;
PVector theGoat;
PVector theCenter;

float theMagnitude;

void setup() {
  size(400,400);
  frameRate(30);
  smooth();

  bigCircle = new PVector(280, 280); // Constant, no need to re-create it on each frame!
  theGoat = new PVector(15, 15); // Idem
  theCenter = new PVector(width/2, height/2);
  //bigCircle.sub(theGoat);
  theMouse = new PVector();
}

void draw() {
  background(255);

  theMouse.set(mouseX,mouseY);

  //Drawing the goat
  fill(0);
  ellipse(theMouse.x, theMouse.y, theGoat.x, theGoat.y);

  //Drawing the big circle
  noFill();
  ellipse(width/2, height/2, bigCircle.x, bigCircle.y);
}

_vk

Another step... Who's afraid of who? : P

PVector bigCircle;
PVector theMouse;
PVector theGoat;
PVector theCenter;

float theMagnitude;

void setup() {
  size(400, 400);
  frameRate(30);
  smooth();

  bigCircle = new PVector(280, 280); // Constant, no need to re-create it on each frame!
  theGoat = new PVector(15, 15); // Idem
  theCenter = new PVector(width/2, height/2);
  //bigCircle.sub(theGoat);
  theMouse = new PVector();
}

void draw() {
  background(255);

  theMouse.set(mouseX, mouseY);

  //Drawing the goat
  fill(0);
  float angle = atan2(theMouse.y - theCenter.y, theMouse.x - theCenter.x  );
  float mag = bigCircle.x/2;
  float x = theCenter.x + cos(angle) * - mag ;
  float y = theCenter.y + sin(angle) * - mag ;
  PVector op = new PVector(x, y);
  ellipse(op.x, op.y, theGoat.x, theGoat.y);

  //Drawing the big circle
  noFill();
  ellipse(width/2, height/2, bigCircle.x, bigCircle.y);
}

killthepixelnow

Hooray, this is awesome. Thanks a lot for cleaning up my code. Now, I have some questions:

What does exactly atan2 do? I assume the "mag" variable equals to the half of the circle width: Is it a regular procedure to use cos for "x" and sin for "y"? What does "op" stand for?

float angle = atan2(theMouse.y - theCenter.y, theMouse.x - theCenter.x  );
float mag = bigCircle.x/2;
float x = theCenter.x + cos(angle) *  -mag ;
float y = theCenter.y + sin(angle) *  -mag ;
PVector op = new PVector(x, y);
ellipse(op.x, op.y, theGoat.x, theGoat.y);

I really appreciate your time with this sketch.

_vk

What does exactly atan2 do?

returns the angle of a given point (x, y) from origin and x axis, see:

http://processing.org/reference/atan2_.html

Is it a regular procedure to use cos for "x" and sin for "y"

yep simple trig

http://mathworld.wolfram.com/Cosine.html

What does "op" stand for

Well I just made same short name, I had opposite in mind... : )

_vk

Ops, and...

I assume the "mag" variable equals to the half of the circle width

Yes, I set it this way to avoid them to meet in the center. The mag is the other coordinate in a polar coordinates system. Angle and distance.

try this mag definition:

float mag = min(dist(theMouse.x, theMouse.y, theCenter.x, theCenter.y), bigCircle.x/2);

killthepixelnow

Thanks for the thorough explanation!