LoadingManager() 사용법

LoadingManager()는 파일 로딩을 관리하는 객체로, 다음과 같은 기능을 제공합니다:

• onLoad(): 로딩이 완료될 때 호출되는 콜백 함수.
• onProgress(): 로딩 진행 상황을 모니터링하는 콜백 함수.
• onError(): 로딩 오류가 발생했을 때 호출되는 콜백 함수.

const manager = new THREE.LoadingManager();
manager.onStart = function (url, itemsLoaded, itemsTotal) {
  console.log('Loading started: ' + url);
};
manager.onLoad = function () {
  console.log('All objects loaded');
};
manager.onProgress = function (url, itemsLoaded, itemsTotal) {
  console.log('Loading progress: ' + (itemsLoaded / itemsTotal) * 100 + '%');
};
manager.onError = function (url) {
  console.error('Error loading: ' + url);
};

const loader = new THREE.GLTFLoader(manager);
loader.load('path/to/your/model.gltf', function (gltf) {
  scene.add(gltf.scene);
}, undefined, function (error) {
  console.error('An error happened', error);
});

주요 Loader()들

Three.js에서는 다양한 파일 형식을 로딩할 수 있는 Loader()들이 제공됩니다. 몇 가지 주요 Loader()들을 소개합니다:

1. OBJLoader: OBJ 파일을 로딩하는 Loader입니다.
2. MTLLoader: Material 파일을 로딩하는 Loader입니다.
3. GLTFLoader: GLTF 파일을 로딩하는 Loader입니다1.
4. FBXLoader: FBX 파일을 로딩하는 Loader입니다.
5. ImageLoader: 이미지 파일을 로딩하는 Loader입니다.

각 Loader()는 로딩을 시작하고 완료되는 시점을 관리하며, LoadingManager()를 사용하여 로딩 상태를 모니터링할 수 있습니다.

const loader = new THREE.GLTFLoader(manager);
loader.load('path/to/your/model.gltf', function (gltf) {
  scene.add(gltf.scene);
}, undefined, function (error) {
  console.error('An error happened', error);
});

이 코드에서는 LoadingManager()를 GLTFLoader의 인스턴스로 전달하여 로딩 상태를 모니터링할 수 있습니다.