Three.js 子网格位置总是返回 (0,0,0)

Posted

技术标签:

【中文标题】Three.js 子网格位置总是返回 (0,0,0)【英文标题】:Three.js Child Mesh position always return (0,0,0) 【发布时间】:2013-01-07 17:13:25 【问题描述】:

我通过 OBJLoader 加载了一些对象,加载的对象包含一个父对象和多个子对象;然后我应用 Raycaster 并找到点击的孩子。

然后我想更新子对象的位置,但是所有子对象的初始位置都为零。

var intersect = intersects[0].object;
intersect.position.y = intersect.position.y + 5; // 0 + 5 

但在我的场景中,一切看起来都很好。另外,如果我删除点击的对象,实际上它是从场景中删除的。我想我错过了一些点,他们的位置不能是(0,0,0)。我怎样才能到达他们的相对位置?

【问题讨论】:

【参考方案1】:

这里是设置Transform Control到对象中心的代码:

let objLoader = new THREE.OBJLoader();
    let mtlLoader = new THREE.MTLLoader();
    mtlLoader.load("path/to/mtlFile.mtl", (materials) => 
        materials.preload();
        objLoader.setMaterials(materials).load("path/to/objFile.obj", (object3d) => 
            object3d.traverse((child) => 
                if (child instanceof THREE.Mesh) 
                    child.geometry.computeBoundingBox();
                    let matrix = new THREE.Vector3();
                    let offset = child.geometry.boundingBox.getCenter(matrix);
                    child.geometry.applyMatrix(new THREE.Matrix4().makeTranslation(-offset.x, -offset.y, -offset.z));
                    child.position.copy(offset);
                    objects.push(child);
                
            );
            scene.add(object3d);
        );
    );

【讨论】:

【参考方案2】:

试试这个,然后读取 position()。我有同样的问题,在这里得到了答案。 (geom 是您的网格几何体。)

objMesh.centroid = new THREE.Vector3();
for (var i = 0, l = geom.vertices.length; i < l; i++) 
    objMesh.centroid.add(geom.vertices[i].clone());

objMesh.centroid.divideScalar(geom.vertices.length);
var offset = objMesh.centroid.clone();

objMesh.geometry.applyMatrix(new THREE.Matrix4().makeTranslation(-offset.x, -offset.y, -offset.z));

objMesh.position.copy(objMesh.centroid);

【讨论】:

:) 我必须承认我没有先相信,但它确实有效。那么我们可以说这是一个three.js的错误吗?由于之前必须计算相对位置,但现在我们手动计算。 不,正如我之前了解到的,这是关于 3D 的核心 :) 对象的位置是相对于它们自身的。【参考方案3】:

位置是相对于父级的

将位置乘以父级的变换以获得世界空间坐标,如果这就是您所寻求的

【讨论】:

我知道存在相对性。但是无论孩子们的位置是什么,他们的位置总是0,0,0。【参考方案4】:

这是因为 obj 文件中的所有对象的轴心都在 World 0,0,0 无论他们在导出之前的本地支点在哪里。

【讨论】:

以上是关于Three.js 子网格位置总是返回 (0,0,0)的主要内容,如果未能解决你的问题,请参考以下文章

Three.js Raycaster 未检测到场景网格

在three.js中播放特定部分的网格动画

在three.js中将网格添加到场景之前如何设置网格的位置

在 Three.js 中基于局部向量定位子网格

Three.js案例从0到1对象跟随鼠标动起来

three.js - 网格组示例? (THREE.Object3D() 高级)