[p5.js] setup(), draw() 함수

설명

setup() : 프로그램이 실행될 때 최초로 1번 실행되는 함수, 캔버스 생성이나 변수 초기화 등의 초기 설정 작업 시 사용

draw() : 프로그램이 실행되고 반복적으로 실행되는 함수, 애니메이션이나 인터렉션하는 데 사용 (기본 초당 60회)

 

예제

원이 왼쪽 위에서 오른쪽 아래로 이동하는 코드입니다.

let x = 0; // 원의 x좌표
let y = 0; // 원의 y좌표

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);       // 배경 설정
  circle(x++, y++ , 50); // 원 그리기
}