let k = 2;

let vX = [];

let vY = [];

let cX, cY, R;

const colorCircle = 'red';

const colorChord  = 'yellow';

​

this.focus();

​

function setup() {

  createCanvas(windowWidth, windowHeight);

  ellipseMode(RADIUS);

  textAlign(LEFT, CENTER);

  textStyle(NORMAL);

  textSize(25);

  cX = width / 2;

  cY = height / 2;

  R = 0.85 * min(cX, cY);

}

​

function execute() {

  background(0);

  drawInfo();

  drawCircle();

  calculateVertex();

  drawChord();

}

​

function drawInfo() {

  noStroke();

  fill('white');

  text('n = ' + n, 15, 20);

  text('k = ' + k, 15, 50);

  noFill();

}

​

function drawCircle() {

  stroke(colorCircle);

  strokeWeight(1);

  ellipse(cX, cY, R);

}

​

function calculateVertex() {

  let angle = TWO_PI / n;

  for (let i = 0; i < n; i++) {

    vX[i] = cX + R * cos(i * angle);

    vY[i] = cY + R * sin(i * angle);

  }

}

​

function drawChord() {

  stroke(colorChord);

  strokeWeight(1);

  let db = 0, i = 0, j;

  while (db < 800) {

    i = i % n;

    j = (i * k) % n;

    line(vX[i], vY[i], vX[j], vY[j]);

    i++;

    db++;

  }

}

​

function draw() { 

  if (n < 400) { n++ }

  execute();

}

​

function keyPressed() {

  if (keyCode == UP_ARROW) {

    n = 2; k++;

  }

  if (keyCode == DOWN_ARROW) {

    if (k > 2) { n = 2; k--; }

  }

}

​