Create a mesh from GLTFLaoder().load() in Thre.js

Question

I have a local 3D object model and I load it with:

const loader = new GLTFLoader();
loader.load("path/to/model", gltf => {
  scene.add(gltf.scene);
});

How should I create a mesh out of the gltf, because when I try:

loader.load("path/to/model", (geometry, materials) => {
  var mesh = new THREE.Mesh(geometry, materials);
  scene.add(mesh);
  mesh.position.z = -10;
});

I get the error:

Cannot convert undefined to object

glTF files may contain an entire scene graph, with many meshes and materials. There's no general way to reduce the entire scene graph down to a single mesh without throwing away most of that information. You can create a list of meshes, or pick out a specific mesh by name, but you can't represent the whole model as a single mesh, unless you've carefully designed the model to have nothing else in it. — Don McCurdy
– Don McCurdy, Commented Jan 27, 2023 at 16:50

Alin-Alexandru Peter · Accepted Answer · 2023-01-27 19:25:29Z

0

I found out that actually by modifying the first function above like this:

loader.load("path/to/model", gltf => {
  var object = gltf.scene.children[0];
  scene.add(gltf.scene);
});

is the solution.
Because now object variable can be totally handled like a normal mesh. Maybe a video to help you.

answered Jan 27, 2023 at 19:25

Alin-Alexandru Peter

1713 silver badges14 bronze badges

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

1 Comment

Cosimo Over a year ago

Perhaps you wanted to say scene.add(object) then? Otherwise I don't see how assigning object makes a difference.

Collectives™ on Stack Overflow

Create a mesh from GLTFLaoder().load() in Thre.js

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related