Skip to content

Latest commit

 

History

History
142 lines (111 loc) · 2.16 KB

p07.md

File metadata and controls

142 lines (111 loc) · 2.16 KB

random() Function

  • index.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <script src="https://cdn.jsdelivr.net/npm/p5@1.5.0/lib/p5.js"></script>
  <script src="sketch.js"></script>
  <title>P5.js 연습</title>
</head>
<body>
  <h1>random() Function</h1>
  
</body>
</html>
  • sketch.js
// let squareSize = 150;
let squareSize;
// let lineWidth = 4;
let lineWidth;

function setup() {
    createCanvas(400, 300);
    // squareSize = random(50, 100);
    // lineWidth = random(2, 10);
    background(100);
}

function draw() {
    // background(100);

    squareSize = random(50, 250);
    lineWidth = random(4, 28);

    rectMode(CENTER);
    strokeWeight(lineWidth);
    // stroke(0, 0, 255);
    stroke(0, 0, 255, 10);
    // fill(0, 255, 0);
    fill(0, 255, 0, 10);
    square(200, 150, squareSize);
}
  • sketch.js
let x, y, r, g, b;

function setup() {
    createCanvas(600, 400);
    background(0);
}

function draw() {
    // r = 255;
    // g = 0;
    // b = 255;
    // x = 100;
    // y = 100;
    // noStroke();
    // fill(r, g, b, 100);
    // circle(x, y, 24);

    r = random(0, 255);
    g = 0;
    b = random(0, 255);
    x = random(0, 600);
    y = random(0, 400);
    noStroke();
    fill(r, g, b, 100);
    circle(x, y, 24);
}
  • sketch.js
let r = 255;
let g = 255;
let b = 255;
let diameter = 32;

function setup() {
  createCanvas(windowWidth, windowHeight);
  background(0);
}

function draw() {
  noStroke();
  fill(r, g, b, 100);
  circle(mouseX, mouseY, diameter);
}

function mousePressed() {
  // background(0);
  r = random(100, 255);
  g = random(100, 255);
  b = random(100, 255);
  diameter = random(16, 64);
}
  • sketch.js
function setup() {
  createCanvas(windowWidth, windowHeight);
  background(0);
}

function draw() {
  noStroke();
  fill(random(50, 255), random(50, 150), random(50, 255), 100);
  circle(mouseX, mouseY, random(24, 64));
}

function mousePressed() {
  background(0);
}