【p5.js】黄金螺旋

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  drawSpiral(50, 100, 300, 8);
}

function drawSpiral(x, y, length, level) {
  const R = (1+sqrt(5))/2;
  let ax, ay, bx, by, px, py, qx, qy;
  
  fill(255);
  rect(x, y, length, length/R);
  
  if (level >= 1) {
    ax = x;
    ay = y;
    bx = x+length;
    by = y;
    px = ax*(1-1/R)+bx*1/R;
    py = ay*(1-1/R)+by*1/R;
    qx = px+(ay-py);
    qy = py-(ax-px);
    line(px, py, qx, qy);
    noFill();
    arc(px, py, length*2/R, length*2/R, HALF_PI, HALF_PI*2);
    fill(255);
  }
  
  if (level >= 2) {
    ax = px;
    ay = py;
    bx = qx;
    by = qy;
    px = ax*1/R+bx*(1-1/R);
    py = ay*1/R+by*(1-1/R);
    qx = px+(by-py);
    qy = py-(bx-px);
    line(px, py, qx, qy);
    noFill();
    arc(px, py, length*2/pow(R,2), length*2/pow(R,2), 0, HALF_PI);
    fill(255);
  }
  
  if (level >= 3) {
    for (let i = 0; i < level-2; ++i) {
      ax = qx;
      ay = qy;
      bx = px;
      by = py;
      px = ax*(1-1/R)+bx*1/R;
      py = ay*(1-1/R)+by*1/R;
      qx = px+(ay-py);
      qy = py-(ax-px);
      line(px, py, qx, qy);
      noFill();
      arc(px, py, length*2/pow(R,i+3), length*2/pow(R,i+3), HALF_PI*(3-i), HALF_PI*(4-i));
      fill(255);
    }
  }
}

今回は、以下のように出力される。