float [] x1 = {
  200,100,100,200,200}; //parent1
float [] y1 = {
  200,200,300,300,200};
float [] x2 = {
  350,300,400,350}; //parent2
float [] y2 = {
  200,300,300,200};
float [] xc, yc; //child
float ratio=0.5; //percentage of interpolation
int k1, k2, maxpoints; //number of points for the arrays
void setup(){
  size(500,400);
  smooth(); //for visual effect
  maxpoints = max(x1.length, x2.length); //the max number of either array
  xc = new float[maxpoints]; //create a child with points as the largest parent
  yc = new float[maxpoints];
}
void draw(){
  background(255);
  stroke(0);
  for(int i=1; i<xc.length; i++) //draw the child’s lines
    line(xc[i],yc[i],xc[i-1],yc[i-1]);
  for(int i=0; i<xc.length; i++) //draw the child’s vertices
    rect(xc[i]-1,yc[i]-1,3,3);
  stroke(255,0,0);
  for(int i=1; i<x1.length; i++) //draw parent 1
    line(x1[i],y1[i],x1[i-1],y1[i-1]);
  for(int i=1; i<x2.length; i++) //draw parent 2
    line(x2[i],y2[i],x2[i-1],y2[i-1]);
}
void mouseDragged(){
  for(int k=0; k<maxpoints; k++){
    if(x1.length>=x2.length){ //if p1 is greater than p2
      k1 = k; //counter 1 remains as is
      k2 = int(k/((x1.length*1.)/(x2.length*1.)));
    } //counter 2 must be adjusted
    else{ //if p2 is greater than p1
      k1 = int(k/((x2.length*1.)/(x1.length*1.)));
      k2 = k;
    }
    xc[k] = x1[k1] + (mouseX*1./width*1.) * (x2[k2] - x1[k1]);
    yc[k] = y1[k1] + (mouseX*1./width*1.) * (y2[k2] - y1[k1]);
  }
}