Regular Polygon / 正多角形

お気に入りは何ですか?五角形?六角形?七角形?それとも二十角形?この例のために作成された polygon() 関数は、あらゆる正多角形を描くことができます。draw() 内の polygon() 関数の呼び出しに異なる数値を入れて探求してみてください。

polygon function geometry
Form Math

View Source Code

/*
 * @name Regular Polygon
 * @arialabel Three white shapes with black outlines on a grey background rotating. From left to right, a triangle, icosagon, and a heptagon
 * @description What is your favorite? Pentagon? Hexagon? Heptagon? No?
 * What about the icosagon? The polygon() function created for this example is
 * capable of drawing any regular polygon. Try placing different numbers into
 * the polygon() function calls within draw() to explore.
 */
function setup() {
  // createCanvas(720, 400);
  createCanvas(windowWidth, windowHeight);
}

function draw() {
  background(102);

  push();
  translate(width * 0.2, height * 0.5);
  rotate(frameCount / 200.0);
  polygon(0, 0, 82, 3);
  pop();

  push();
  translate(width * 0.5, height * 0.5);
  rotate(frameCount / 50.0);
  polygon(0, 0, 80, 20);
  pop();

  push();
  translate(width * 0.8, height * 0.5);
  rotate(frameCount / -100.0);
  polygon(0, 0, 70, 7);
  pop();
}

function polygon(x, y, radius, npoints) {
  let angle = TWO_PI / npoints;
  beginShape();
  for (let a = 0; a < TWO_PI; a += angle) {
    let sx = x + cos(a) * radius;
    let sy = y + sin(a) * radius;
    vertex(sx, sy);
  }
  endShape(CLOSE);
}

License

Source code is available on GitHub p5.js website legacy.

All examples are licensed under CC BY-NC-SA 4.0.