|
@@ -48,39 +48,49 @@
|
|
<code>
|
|
<code>
|
|
// Instantiate a loader
|
|
// Instantiate a loader
|
|
var loader = new THREE.GLTFLoader();
|
|
var loader = new THREE.GLTFLoader();
|
|
-
|
|
|
|
|
|
+
|
|
// Load a glTF resource
|
|
// Load a glTF resource
|
|
loader.load(
|
|
loader.load(
|
|
// resource URL
|
|
// resource URL
|
|
'models/gltf/duck/duck.gltf',
|
|
'models/gltf/duck/duck.gltf',
|
|
// called when the resource is loaded
|
|
// called when the resource is loaded
|
|
function ( gltf ) {
|
|
function ( gltf ) {
|
|
-
|
|
|
|
|
|
+
|
|
scene.add( gltf.scene );
|
|
scene.add( gltf.scene );
|
|
-
|
|
|
|
|
|
+
|
|
gltf.animations; // Array<THREE.AnimationClip>
|
|
gltf.animations; // Array<THREE.AnimationClip>
|
|
gltf.scene; // THREE.Scene
|
|
gltf.scene; // THREE.Scene
|
|
gltf.scenes; // Array<THREE.Scene>
|
|
gltf.scenes; // Array<THREE.Scene>
|
|
gltf.cameras; // Array<THREE.Camera>
|
|
gltf.cameras; // Array<THREE.Camera>
|
|
-
|
|
|
|
|
|
+
|
|
},
|
|
},
|
|
// called when loading is in progresses
|
|
// called when loading is in progresses
|
|
function ( xhr ) {
|
|
function ( xhr ) {
|
|
-
|
|
|
|
|
|
+
|
|
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
|
|
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
|
|
-
|
|
|
|
|
|
+
|
|
},
|
|
},
|
|
// called when loading has errors
|
|
// called when loading has errors
|
|
function ( error ) {
|
|
function ( error ) {
|
|
-
|
|
|
|
|
|
+
|
|
console.log( 'An error happened' );
|
|
console.log( 'An error happened' );
|
|
-
|
|
|
|
|
|
+
|
|
}
|
|
}
|
|
);
|
|
);
|
|
</code>
|
|
</code>
|
|
|
|
|
|
[example:webgl_loader_gltf]
|
|
[example:webgl_loader_gltf]
|
|
|
|
|
|
|
|
+ <h2>Browser compatibility</h2>
|
|
|
|
+
|
|
|
|
+ <p>GLTFLoader relies on ES6 <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Promise">Promises</a>,
|
|
|
|
+ which are not supported in IE11. To use the loader in IE11, you must
|
|
|
|
+ <a href="https://github.com/stefanpenner/es6-promise">include a polyfill</a>
|
|
|
|
+ providing a Promise replacement.</p>
|
|
|
|
+
|
|
|
|
+ <br>
|
|
|
|
+ <hr>
|
|
|
|
+
|
|
<h2>Constructor</h2>
|
|
<h2>Constructor</h2>
|
|
|
|
|
|
<h3>[name]( [page:LoadingManager manager] )</h3>
|
|
<h3>[name]( [page:LoadingManager manager] )</h3>
|