Tracing a point on a moving circle

I am trying to create an animation of a cardioid, I currently have 2 circles:
one is set to (0, 0) translated to width/2, height/2 (center).
the other is moving around the stationary

I would like to start at point(-100, 0)
with the point drawing a line of its motion as the “wheel” spins around the world… is that possible in Java?

Here is my code:

int rad = 100; //radius of each circle
float xpos, ypos; //starting position for circle in motion
int xpo, ypo = 0; //position for stable circle
float xspeed = 1;
float yspeed = 1;
float xdi = 1.5; //direction moves along x axis
float ydi = -1.5; // direction moves along y axis
float step = .01;
float pct = 0.0;
int xa = 200; //point for xdi to change
int xb = -200; //point for xdi to change
int ya = -200; //point for ydi to change
int yb = 200; // point for ydi to change

void setup(){
size(800,800);
// background(0);
smooth();
noStroke();
frameRate(30);
ellipseMode(RADIUS);
//center point for circle in motion
xpos = -200;
ypos = 0;
}

void draw() {
background(0);
translate(width/2, height/2);

  stroke(255, 0, 0);
  strokeWeight(2);
  noFill();
  ellipse(xpo, xpo, rad, rad);

  float t = millis()/1000.0f;
  xpos = (int)(ypo+xa*cos(t));
  ypos = (int)(ypo+xa*sin(t));


 /* xpos = xpos + (xspeed * xdi);
    ypos = ypos + (yspeed * ydi);
*/ 
/*
   if (xpos == xa) {    //change direction when circle is right of other circle
         xdi = -1.5;
   } 
   if (xpos == xb) {   //change direction when circle is left of circle
            xdi = 1.5;
   }
   if (ypos == ya){   // change direction when circle is below
         ydi = -1.5;
   } 
   if(ypos == yb) {    //change direction when circle is above
          ydi = 1.5;
   }

*/
stroke(0, 0, 255);
strokeWeight(2);
set(-100, 0, 0);
noFill();
rotate(.01);
ellipse(xpos, ypos, rad, rad);

stroke(0, 255, 0);
point(-100, 0);

}

edited to clean up the coding for clarity

Go back please

Edit your post

Select the code and hit the small button </>

Then Save Edit