var yoff=0

let angle1=0, x1=100, y1=100

let angle2=0, x2=100, y2=100

let angle3=0, x3=100, y3=100

let angle4=0, x4=100, y4=100

​

​

function setup() {

  createCanvas(1200, 1200);

  colorMode(HSB)

  angleMode(DEGREES)

}

​

function draw() {

  background(220);

  fishbody1()

  fishhead()

  fishface()

}

​

function fishface(){

​

fill(255)

circle(mouseX, mouseY, 50)

  fill(0)

circle(mouseX, mouseY, 30)

}

​

function fishhead() {

noFill()

//duplicate circles multiple times with lag following path

let size=100

circle(mouseX,mouseY,size)

}

function fishbody1() {

  noFill();

  // translate(mouseX, mouseY);

  let r = 90;

  dx1= mouseX-x1

  dy1= mouseY-y1

  angle1=atan2(dy1,dx1)

  x1= mouseX- cos(angle1)*r/2

  y1= mouseY- sin(angle1)*r/2

​

​

  circle(x1, y1, r);

  //bodylink2

  let r2 = 80;

  dx2= x1-x2

  dy2= y1-y2

  angle2=atan2(dy2,dx2)

  x2= x1- cos(angle2)*r2/2

  y2= y1- sin(angle2)*r2/2

​

  circle(x2, y2, r2);

  //bodylink3

  let r3 = 70;

  dx3= x2-x3

  dy3= y2-y3

  angle3=atan2(dy3,dx3)

  x3= x2- cos(angle3)*r3/2

  y3= y2- sin(angle3)*r3/2

​

  circle(x3, y3, r3);

  //bodylink4

  let r4 = 70;

  dx4= x3-x4

  dy4= y3-y4

  angle4=atan2(dy4,dx4)

  x4= x3- cos(angle4)*r4/2

  y4= y3- sin(angle4)*r4/2

​

  circle(x4, y4, r4);

}

​

​