loading models - threejs

Question

I've stumbled upon an issue with loading objects into three.js viewport. Tutorials show that it's required to use THREE.ObjectLoader(). As far as I'm concerned, ObjectLoader was removed a few versions ago. What's the way of loading models correctly or what loader (and file format) should I use? I tried GLTFLoader

import * as THREE from "https://cdn.jsdelivr.net/npm/[email protected]/build/three.module.js";
import { OrbitControls } from "https://cdn.jsdelivr.net/npm/[email protected]/examples/jsm/controls/OrbitControls.js";
import { GLTFLoader } from 'https://cdn.jsdelivr.net/npm/[email protected]/examples/jsm/loaders/GLTFLoader.js';
...
let loader = new GLTFLoader();

loader.load('./models/object.gltf',
    (obj) => {
        scene.add(obj);
    }
);

It throws me three.module.js:5562 THREE.Object3D.add: object not an instance of THREE.Object3D. CDN loaders can be found here - https://cdn.jsdelivr.net/npm/[email protected]/examples/jsm/loaders/

Update: How to import data using ObjectLoader?

import * as THREE from "https://cdn.jsdelivr.net/npm/[email protected]/build/three.module.js";
import { OrbitControls } from "https://cdn.jsdelivr.net/npm/[email protected]/examples/jsm/controls/OrbitControls.js;
...
let loader = new THREE.ObjectLoader();

loader.load('./models/object.json',
    (obj) => {
        scene.add(obj);
    }
);

/* throws
   three.module.js:39957 THREE.ObjectLoader: Loading "Geometry"
   is not supported anymore
*/

Mugen87 · Accepted Answer · 2020-07-11 14:50:45Z

1

THREE.ObjectLoader has not been removed from the repository. You can use it for loading three.js custom JSON format.

For loading external models authored in DCC tools like Blender, the recommended 3D format is glTF. Unfortunately, you do not use the loader correctly. It should be:

loader.load('./models/object.gltf',
    (gltf) => {
        scene.add(gltf.scene);
    }
);

I suggest you have a look at the official documentation page of THREE.GLTFLoader in order to better understand how the gltf parameter of the onLoad() callback is structured.

answered Jul 11, 2020 at 14:50

Mugen87

31.2k4 gold badges34 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

9 Comments

LirysJH Over a year ago

Got it. But I can't find the CDN path to ObjectLoader.js . Could u help me with that, please? (If I simply add ObjectLoader.js to my js project folder that will require a lot of other imports)

Mugen87 Over a year ago

ObjectLoader is part of the main library. Meaning its sufficient to include three.module.js.

LirysJH Over a year ago

Okay. If I use THREE.ObjectLoader it throws me "three.module.js:39957 THREE.ObjectLoader: Loading "Geometry" is not supported anymore.". How can I load data from JSON instead?

LirysJH Over a year ago

Or simply how to import models with no errors using THREE.ObjectLoader ?

Mugen87 Over a year ago

It the message Loading "Geometry" is not supported anymore. appears, that means you are try to load legacy JSON files. In this case, you have to go back to release r98.

|

Collectives™ on Stack Overflow

loading models - threejs

1 Answer 1

9 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

9 Comments

Your Answer

Sign up or log in

Post as a guest

Related