How to get actual mesh position in GLTF scene?

Questions
1

I have loaded the GLTF scene which was exported from Sketchup. I am trying to get the meshes actual position in the scene. The console I do not get the mesh positions. If I use child.position.set(1,1,1) which is reflected in the console log but without using position.set() the position of the mesh not shown.
Below my code

    const gltfLoader = new GLTFLoader();
        var model = new THREE.Object3D();
        gltfLoader.load('images/ann2.gltf', (gltf, el) => {
            model = gltf.scene;
            model.name = 'model';

            // Add gltf model to scene
        scene.add(model);
        //change color
        var newMaterial = new THREE.MeshBasicMaterial({color: 0xffff});
        var newMaterial2 = new THREE.MeshStandardMaterial({color: 0xffffff});
        
        scene.traverse(function (child) {
            
        //console.log(child,'sureshhhhh')
        if (child.name == "Component#1")  {
            console.log(child.name, "child_name")
            child.material = newMaterial;
            
        
        
        }else if (child.name == "Component#2") {
            
            child.material = newMaterial2;
            //child.position.set(1,1,1)
            var positionA = new THREE.Vector3();
            scene.updateMatrixWorld(true);
            positionA.setFromMatrixPosition(child.matrixWorld);
            console.log(positionA.x+',' +positionA.y+',' +positionA.z);
            console.log(child.localToWorld( positionA ),'position comp' );
           
        } 
            const box1 = new THREE.Mesh(
            new THREE.BoxGeometry(2, 2, 2),
            new THREE.MeshStandardMaterial({
                color: 0xffff00,
                name: 'suresh'
            })
        );
        // Retrieves Object3D in the scene
       
        
        model.add(box1);
        //box1.position.set(1, 2, 3);
        var axes = new THREE.AxesHelper(15);
        model.add( axes );
        //this is for get model name
        //model = scene.getObjectByName(model.name)
        //console.log(model,'dsdddgfdsggfdsgdg')
        scene.up
        var positionB = new THREE.Vector3();
        scene.updateMatrixWorld(true);
        positionB.setFromMatrixPosition(box1.matrixWorld);
        console.log(positionB.x+',' +positionB.y+',' +positionB.z);
        
        });
       
        
          const box = new THREE.Box3().setFromObject(model);

          const boxSize = box.getSize(new THREE.Vector3()).length();
          const boxCenter = box.getCenter(new THREE.Vector3());
          console.log(boxSize,'box bounding box')

position_2
position_21902×983 74.7 KB
position_1
position_11920×777 72.4 KB

2

If you want an object’s position in world space (which is in some sense it’s “real” position in the world), use Object3D.getWorldPosition().

1 Like
3

@Mugen87 Thank you.
I used gltf.scene.getWorldPosition( child.position ); but again it shows the position result like Vector3 {x: 0, y: 0, z: 0}

   scene.traverse(function (child) {
            
    if (child.name == "Component#1")  {
        console.log(child.name, "child_name")
        child.material = newMaterial;
    
    
    }else if (child.name == "Component#2") {
        
        child.material = newMaterial2;
        //child.position.set(1,1,1)
        var positionA = new THREE.Vector3();
        scene.updateMatrixWorld(true);
        positionA.setFromMatrixPosition(child.matrixWorld);
        console.log(positionA.x+',' +positionA.y+',' +positionA.z);
        console.log(child.localToWorld( positionA ),'position value' );
        console.log(gltf.scene.getWorldPosition( child.position ));
        
    }
4

Hi, did you ever solve this issue? I currently have it and this is the only post I’ve found that addresses the problem in the exact same way I have. Downloading 3d models from sketchfab has proven to be incredibly difficult in using in Three.js

5

I think you can use this code

geometry.computeBoundingBox();
 
var centroid = new THREE.Vector3();
centroid.addVectors( geometry.boundingBox.min, geometry.boundingBox.max );
centroid.multiplyScalar( 0.5 );
 
centroid.applyMatrix4( mesh.matrixWorld );

————————————————
版权声明：本文为CSDN博主「猿儿本无心」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：threejs怎么处理加载obj模型的子对象的位置为{0,0,0}的问题_Yuanben_wuxin的博客-CSDN博客

1 Like
7

To someone that wants to reach that using react three fiber, i did it in that way
useFrame(() => {
if (cuboRef.current) {
const worldPosition = new THREE.Vector3();
cuboRef.current.getWorldPosition(worldPosition);
console.log(‘Mesh World Position:’, worldPosition);
}
});