let interval, angle, radius, detailX, detailY;

function setup() {

  width = 512

  height = width;

  createCanvas(400, 400, WEBGL);

  interval = 50;

  angle = PI  / interval;

    radius = width * 46 / 100;

  detailX = 1;

  detailY = 1;

    xViewOffset = atan(PI / 7);

 // zViewOffset = PI * 3 / 4;

}

​

function draw() {

  ortho(-300, 300, 300, -300, 0, 800);

  rotateX(xViewOffset);

  //rotateZ(zViewOffset);

  //rotateZ(40);

  background(0, 10, 20, 230)

  // ambientLight(150);

  // ambientMaterial(250);

  fill(20, 50, 80, 230)

  smooth();

  stroke(10, 90, 120);

  strokeWeight(9);

  rotateY(angle);

  //rotateZ(angle);

  push();

  sphere(radius, detailX % 25, detailY % 25);

  pop();

  if (frameCount % interval == 0 && detailX <= 23 && detailY <= 23) {

    console.log(detailX, detailY, angle / TWO_PI);

    detailX += 1;

    detailY += 1;

  }

  angle += PI / interval;

  //pointLight(width / 2, height / 2, width / 2, 0, 30, 50);

}