はんざき技研

プログラミングや3DCGの記録

【p5.js問題集】正多角形を描く【3問目】

次のような正多角形を描いてください。
角の数や色、向きなどは自由とする。

function setup() {
  createCanvas(400, 400);
  background(250);

  //角の数と半径を宣言する
  const num = 5;
  const rad = 200;

  fill(150, 150, 200);
  
  //図を中心に置くためにtranslateを適用する
  translate(width / 2, height / 2);
  
  //beginShapeと三角関数を用いて連続で線を引く
  beginShape();
  for (let i = 0; i < num; i++) {
    let angle = (TAU / num) * i;
    let x = rad * cos(angle);
    let y = rad * sin(angle);
    vertex(x, y);
  }
  //ストロークを閉じるためにCLOSEを入力する
  endShape(CLOSE);
}

補足
beginShapeと三角関数は基本図形の関数では描けない図形を描く際によく出てくるので必須級
numの数値を変えるだけで任意の多角形を描けるように変数を活用している。