지난 번에 Verlet 적산법 개념 설명에 이어 시뮬레이션 예시를 만들어봤다. 중력가속도만 적용되는 단순한 상황인 경우만 놓고 보니 아주 자연스러운 애니메이션이 만들어졌다. 또한 혼자서만 움직이는 게 아니라 입자를 마우스로 잡아 움직일 수 있게, 즉 인터랙티브하게 만들어봤다. 아래 예시는 IE9 이상 및 기타 최신 브라우저에서 볼 수 있다.
예시
첫 번째 예시는 공 한 개가 자유 낙하하는 애니메이션이다. [시작] 단추를 누르면 되며 공을 마우스로 잡아 움직이거나 던질 수 있게 했다.
이 번에는 삼각형 물체와 사각형 물체가 자유 낙하하는 애니메이션이다. 역시 입자를 마우스로 잡아 움직일 수 있게 했다.
세 번째는 긴 막대기가 수직으로 떨어지는 애니메이션이다. 떨어진 후 쓰러지는 움직임이 더 주목할 만 하다. 그리고 역시 입자를 잡아 움직일 수 있게 했는데 위 두 가지와 다른 점은 캔버스 안에 마우스 커서가 들어가면 애니메이션이 진행되고 나오면 멈추게 했다.
막대를 마우스로 한 쪽 끝을 잡아 들어 거꾸로 세운 다음 중심 잡기를 해보기 바란다. 실제에서도 재미로 우산 중심 잡기를 하는 것처럼 중심 잡기가 실감이 난다.
후기
마우스로 입자를 잡아 끄는 처리는 아주 쉬웠다. Verlet 방법의 장점이 가장 잘 나타나는 것이 이것인데 이동 거리와 가속도만 신경 쓰면 되는 간단한 방식이므로 마우스로 물체를 옮기는 힘(즉 가속도)을 따로 고려할 것 없이 결국 이동 좌표만 지정해주면 매순간 그 이동한 만큼이 속도가 되어 바로 반영되는 것이다.
그런데 Verlet 적산법만으로는 (당연하겠지만) 완전한 물리 시뮬레이션이 되지 않는다. 실제 물리 현상에서는 충돌에 의한 반동도 있고 마찰력도 있고 탄성도 있고 갖가지 힘과 반작용이 난무(?)한다. 따라서 이런 것들도 고려해야 하는데 여기서는 캔버스 벽과의 마찰력, 반동 정도만 고려했다. 반동은 좌표 값에 따라 이동 값을 반대로 해주면 되는 것이었고 마찰력은 이동 방향의 반대의 힘을 넣어주는 것으로 처리했다. 자세한 것은 본 예시에 사용한 JavaScript 파일을 참고하기 바란다.
이상으로 Verlet 공부를 마치기로 한다. 시뮬레이션 예시까지 만들며 열심히 해봤는데 게임을 만든다거나 복잡한 응용은 사실 이것으로는 극히 일부분만 해결이 된다고 볼 수 있다. 나중에 필요하면 좀더 연구해보기로 하겠다.