Simple Shapes / 単純な図形

この例には、円、正方形、三角形、花が含まれています。

shapes primitives beginner
Hello P5 Drawing

View Source Code

/*
 * @name Simple Shapes
 * @arialabel Grey canvas with 4 pink shapes: a circle, a rectangle, a triangle, and a flower
 * @description This examples includes a circle, square, triangle, and a flower.
 */
function setup() {
  // Create the canvas
  // createCanvas(720, 400);
  createCanvas(windowWidth, windowHeight);
  background(200);

  // Set colors
  fill(204, 101, 192, 127);
  stroke(127, 63, 120);

  // A rectangle
  rect(40, 120, 120, 40);
  // An ellipse
  ellipse(240, 240, 80, 80);
  // A triangle
  triangle(300, 100, 320, 100, 310, 80);

  // A design for a simple flower
  translate(580, 200);
  noStroke();
  for (let i = 0; i < 10; i ++) {
    ellipse(0, 30, 20, 80);
    rotate(PI/5);
  }
}

License

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

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