将整个 Object3D/Mesh 层次结构合并在一起

Merging an entire Object3D/Mesh hierarchy together

本文关键字:层次结构 合并 在一起 Mesh Object3D      更新时间:2023-09-26

我正在做一个动态生成树的项目。它目前仅处于早期原型阶段,因此树枝和叶子只是简单的立方体。树由多维数据集的层次结构组成,嵌套着分支的旋转和缩小。我需要能够向树中添加更多分支/叶子,但可以将其转换为静态树仅用于渲染目的。

当树变得太大时,我遇到了一个问题,渲染了许多多维数据集,减慢了程序的速度。

经过大量的研究,我发现了三个。GeometryUtils.merge() 函数,它将树中的所有分支合并到一个对象中,该对象可以比以前更快地渲染/转换。但是,我遇到的问题是合并没有考虑所有父转换,只合并它的顶点。

我尝试工作的基本代码如下。我已经尝试将矩阵应用于几何体和其他一些东西,但还没有任何东西正常工作。

var newGeo = new THREE.Geometry();
var newTree = tree.clone(); //Clones the tree so the original does not get altered
newTree.traverse(function(child){
    if(child.parent){
        child.applyMatrix( child.parent.matrixWorld);
    }
    THREE.GeometryUtils.merge(newGeo, child);
});

我为它创建了一个简单的jsFiddle程序:

http://jsfiddle.net/JeYhF/2/左侧对象是彼此内部的 4 个网格,右侧对象是网格组合。如您所见,组合的每个组件都应用了自己的变换(在 y 轴上平移 11 个单位,在 z 轴上按 PI/4 旋转),但它们不受父变换的影响。有问题的函数是 MergeTree() 函数。该程序仅适用于我。

有关如何解决此问题的任何建议将不胜感激。谢谢

问题是矩阵世界在合并之前没有计算。所以变换都只是单位矩阵。

newTree.traverse(function(child){
    if(child.parent){
        child.updateMatrixWorld();
        child.applyMatrix(child.parent.matrixWorld);    
    }
    THREE.GeometryUtils.merge(newGeo, child);
});