//X'=((X-Xc)*(F/Z))+Xc

//Y'=((Y-Yc)*(F/Z))+Yc

class Point{

  constructor(x,y,z=0) {this.x=x;this.y=y;this.z=z;}

}

function transform(Xc,Yc,Zc,X,Y,Z) {

  // let F=Z-Zc;

  let F=dist(Xc,Yc,X,Y,Zc,Z)/4;

  return new Point(

    ((X - Xc) * (F/Z)) + Xc,

    ((Y - Yc) * (F/Z)) + Yc

  );

}

​

​

let cPos=new Point(0,0,0);

let cRot=new Point(0,0,0);

let points=[new Point(200,200,4),new Point(200,100,4),new Point(300,200,4)];

let np;

let t=0;

​

function setup() {

  createCanvas(400, 400);

  let i=0;

  np = transform(

    cPos.x,cPos.y,cPos.z,

    points[i].x,points[i].y,points[i].z);

  console.log(np)

  strokeWeight(4)

}

​

let speed=1;

function draw() {

  background(220);

  stroke(20);

  for (let i=0;i<points.length;i++) {

    np = transform(

      cPos.x,cPos.y,cPos.z,

      points[i].x,points[i].y,points[i].z);

    // if (t%10==0) {console.log(np.x,np.y);}

    strokeWeight(0.1*

      dist(

        cPos.x,cPos.y,

        points[i].x,points[i].y,

        cPos.z,points[i].z

        )

    );

    point(np.x,np.y);

    // points[i].x+=random(-1,1);

    // points[i].y+=random(-1,1);

    // points[i].z+=random(-1,1);

  }

  if (keyIsDown(87)) {cPos.z+=speed;}//w

  if (keyIsDown(83)) {cPos.z-=speed;}//s

  if (keyIsDown(65)) {cPos.x-=speed;}//a

  if (keyIsDown(68)) {cPos.x+=speed;}//d

  if (keyIsDown(81)) {cPos.y-=speed;}//q

  if (keyIsDown(69)) {cPos.y+=speed;}//e

  // pPos.z+=0.1;

  t+=1;

//   point(pPos.x*width,pPos.y*height)

}