p5.js로 2차원 pendulum 만들기

각도와 사인 함수의 반환값

• 라디안 단위의 각도: 사인 함수는 입력된 각도를 라디안 단위로 받아들인다. 1 라디안은 약 57.3도이다.
• 사인 값: 주어진 각도에 따라 사인 값은 다음과 같이 변한다:
  • sin⁡(0)=0sin(0)=0
  • sin⁡(𝜋2)=1sin(2π​)=1
  • sin⁡(𝜋)=0sin(π)=0
  • sin⁡(3𝜋2)=−1sin(23π​)=−1
  • sin⁡(2𝜋)=0sin(2π)=0

 

let angle;

// angleVelocity
let angleV = 0;
// angleAcceleration
let angleA = 0.001;

let bob;
let len;

let gravity = 1;

function setup() {
  createCanvas(600, 800);
  origin = createVector(300, 0);
  angle = PI / 4; // 0.78
  console.log(angle, "angle");
  bob = createVector();
  len = 300;
}

function draw() {
  background(0);

  let force = gravity * sin(angle);
  // console.log(force, "force");
  angleA = (-1 * force) / len;
  angleV += angleA;
  angle += angleV;
  console.log(angle, "angle");

  angleV *= 0.99;

  // bob이 추이다.
  bob.x = len * sin(angle) + origin.x;
  bob.y = len * cos(angle) + origin.y;

  stroke(255);
  strokeWeight(8);
  fill(127);

  // 시작점의 x,y, bob의 x,y를 라인으로 이음
  line(origin.x, origin.y, bob.x, bob.y);
  // bob의 x, y를 중점으로 반지름 64의 원을 생성
  circle(bob.x, bob.y, 64);
}