How to access or obtain the vertices of 3D model by loading gltf model

Questions
, ,
1

Hi there,

could you please teach me how to access or obtain the vertices of the 3D model, like the following. Thanks.

let gltf = await loader.loadAsync(“https://threejs.org/examples/models/gltf/Nefertiti/Nefertiti.glb”);
let model = gltf.scene;

2 
let meshes = []
model.traverse(e=>e.isMesh&&meshes.push(e));
meshes.forEach(mesh=>{
  let g = mesh.geometry;
  let points = g.attributes.position;
  for(let i=0;i<points.count;i++){
     let x = points.getX(i);
     let y = points.getY(i);
     let z = points.getZ(i);
  }
})
1 Like
3

Thanks for your info.

I tried but, it did not work. Anyway, I got a sense of how to handle it.

Thanks.

4

Wups I had a typo. I fixed it.

5

Thanks. It worked. I still have not found the typo. :slight_smile:

6

I’ve always wondered about that myself.

Just to clarify, does that give you their position in global space or relative to the center of the object? I am guessing the latter, in which case you merely have to add the result to the position of the object center to get the global position.

Also, is there an opposite to position.set(x,y,z), e.g. position.get(x.y.z)?

1 Like
7

Just to clarify, does that give you their position in global space or relative to the center of the object?

It’s just getting the raw vertex data into x,y,z … in “model space”.

in which case you merely have to add the result to the position of the object center to get the global position.

That isn’t enough because it doesn’t take rotation/scale into account.

Here’s the whole witchchant to get vertices in worldspace:


let v = new THREE.Vector3();
let meshes = []
model.traverse(e=>e.isMesh&&meshes.push(e));
meshes.forEach(mesh=>{
  let g = mesh.geometry;
  let points = g.attributes.position;
  for(let i=0;i<points.count;i++){
     v.set(points.getX(i),points.getY(i),points.getZ(i));
     mesh.localToWorld(v);
    console.log("world space vertex:",v)
  }
})
2 Likes
8

Hi Manthrax,

Can I ask one further question?

How could I get the positions outside the scope of the loader.load function? I tried the following code in the end of the program to access the positions, and it only showed the error, TypeError: undefined is not an object.

console.log(scene.children[0].geometry.getAttribute(‘position’));
console.log(scene.getObjectByName[‘XXX’].geometry.getAttribute(‘position’));

Thanks.

9

You can’t.

If you have to get it outside of the scope, then you can use the “loadAsync” method instead of “load”.

let glb = await gltfLoader.loadAsync("yourModel.glb"); //Load the model synchronously

let model = glb.scene;
let v = new THREE.Vector3();
let meshes = []
model.traverse(e=>e.isMesh&&meshes.push(e));
meshes.forEach(mesh=>{
  let g = mesh.geometry;
  let points = g.attributes.position;
  for(let i=0;i<points.count;i++){
     v.set(points.getX(i),points.getY(i),points.getZ(i));
     mesh.localToWorld(v);
    console.log("world space vertex:",v)
  }
})

To use “await” at the top level, your code has to be in a script type=‘module’

10

Thanks.

I just learned that putting the simliar code in the animation function without using await loader.loadAsync still could return the position data. Which is not a normal use case, though.

I am curious about the design mechanism of the 3D object loader.