본문으로 건너뛰기

Three.js 기본 구조 이해하기

https://threejs.org/manual/#en/fundamentals

Renderer

Scene

Scene은 Scene Graph의 루트 노드로 background, fog 등을 설정할 수 있습니다.

Scene은 Mesh, Light, Group, Object3D, Camera 같은 객체를 자식 노드로 가질 수 있습니다.

Camera

Camera는 사용자가 Scene을 보는 시점을 결정합니다. Camera는 Scene Graph에 속할 수도 속하지 않을 수도 있습니다. Camera가 Scene Graph에 속해서 어떤 객체의 자식노드가 되면, 해당 객체의 좌표계를 기준으로 카메라의 시점을 설정할 수 있습니다.

PerspectiveCamera

https://threejs.org/manual/#en/cameras

직접 보기

  • Three.js Editor를 이용하여 Scene Graph를 만들고 Camera를 부착해보면서 Three.js의 구조를 이해할 수 있습니다.
  • Three.js Primitives에서 3D 객체의 파라미터에 따른 형태를 미리보기할 수 있습니다.