I took the starter code for loading a GLTF model into the scene and I wanted to loaded some models into the canvas.
I tried a dummy example with loading a Duck.gltf file from a folder called glTF that contains Duck.gltf
, Duck0.bin
, and DuckCM.png
files. I am able to successfully load it into the scene with the following code below. This also loads in another windows program called 3D viewer successfully.
But when I try to load my own model.gltf
file, it appears to be scaled down in size and I have to zoom all the way in to see it. The model.gltf
file resides in a folder called my_model
which contains the model.gltf
file, several model_0001.bin
, model_0002.bin
, …, model_0088.bin
files and couple png texture files.
I also have a 3mf version of the same model and when I load the 3mf version model.3mf
instead of the model.gltf
file format, I get the correct large size of the model being displayed. How can I increase the model.gltf
size so I can visually see it in the canvas, and why is there a discrepancy between the 3mf size and gltf size?
// Instantiate a loader
const loader = new GLTFLoader();
// Load a glTF resource
loader.load(
// resource URL
'my_model/model.gltf',
//'glTF/Duck.gltf',
// called when the resource is loaded
function ( gltf ) {
scene.add( gltf.scene );
gltf.animations; // Array<THREE.AnimationClip>
gltf.scene; // THREE.Group
gltf.scenes; // Array<THREE.Group>
gltf.cameras; // Array<THREE.Camera>
gltf.asset; // Object
},
// called while loading is progressing
function ( xhr ) {
console.log( ( xhr.loaded / xhr.total * 100 ) + '% loaded' );
},
// called when loading has errors
function ( error ) {
console.log( 'An error happened' );
}
);