Klein Hyperbolic

var scaleFactor;

let v;

let u;

let p = [];

let q = [];

let rtPentSm = 0.4858682717566458;//sqrt(sqrt(5)-2);

let rtPentLg = 0.7861513777574233;//sqrt(sqrt(1.25)-0.5);

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  ellipseMode(RADIUS);

  scaleFactor = min(width,height)/2.5;

  p.push(new p5.Vector(0,0));

  p.push(new p5.Vector(0,rtPentLg));

  p.push(new p5.Vector(rtPentSm,rtPentLg));

  p.push(new p5.Vector(rtPentLg,rtPentSm));

  p.push(new p5.Vector(rtPentLg,0));

  v = new p5.Vector(0.9,0.1);

  uP = new p5.Vector(-0.2,0.4);

  u = Klein.add(v,uP);

  // console.log(sqrt(sqrt(5)-2));

  // console.log(sqrt(sqrt(1.25)-0.5));

  // console.log(Klein.dist(v,uP));

  // console.log(Klein.getClosestPointToOrigin(u,v));

}

​

function draw() {

  centerCanvasOnUnitOrigin();

  background(100);

  strokeWeight(1/(scaleFactor*2)); noFill();

  showAxes(); showUnitCircle();

  // v is a point moving back and forth in hyperbolic space in a sinusoidal way through the origin

  let multiplier = 1;

  let x = new p5.Vector(cos(frameCount/60),0.0).mult(multiplier*atanh(rtPentLg));

  let m = x.mag();

  v = x.copy().setMag(tanh(m));

  // uP is a point rotating about v in a circle.

  uP.set(cos((frameCount+30)/80),sin((frameCount+30)/80)).mult(rtPentLg);

  u = Klein.add(v,uP);

  vectorLine(u,v);

  let ideals = Klein.idealPoints(u,v);

  vectorLine(ideals[0],ideals[1]);

  // draw circles

  fill(255,0,0); vectorCircle(u, 0.02);

  fill(0,0,255); vectorCircle(v, 0.02);

  fill(255,0,0); vectorCircle(ideals[0], 0.01);

  fill(0,0,255); vectorCircle(ideals[1], 0.01);

  // draw pentagon

  for (let i = 0; i < 5; i++) { vectorLine(p[i], p[(i+1)%5]); }

  // create and draw moving pentagon

  q = [];

  p.forEach(pv => {

    let s = Klein.add(v,pv);

    q.push(s);

  });

  for (let i = 0; i < 5; i++) { vectorLine(q[i], q[(i+1)%5]); }

  fill(255,255,0);

  for (let vert of p) { vectorCircle(vert, 0.01); }

}

​

function centerCanvasOnUnitOrigin() {

  translate(width/2,height/2); scale(scaleFactor,-scaleFactor);

}

​

function showAxes() {

  line(-(windowWidth-10)/(scaleFactor*2),0,(windowWidth-10)/(scaleFactor*2),0);

  line(0,-(windowHeight-10)/(scaleFactor*2),0,(windowHeight-10)/(scaleFactor*2));

}

​

function showUnitSquare() {

  rect(-1,-1,2,2);

}

​

function showUnitCircle() {

  circle(0, 0, 1);

}

​

​

​

​