javascript - 【three.js】scene有多个模型，却只渲染出一个，如何解决？

Question

问题描述：
我使用three.js来渲染模型，然后我是打算实现分层渲染的效果，所以模型按照层数给到了我，所以就是多个模型一起渲染。

可以看到下面的图片，是有很多模型数据的。我是使用new THREE.Object3D() 或者 new THREE.Group() 来集合这些模型的，然后scene.add(floorGroup)。scene里面的确也是有这些模型数据的存在。
但是实际渲染的时候却只有一层，而且每次刷新都不一定是之前的那一层，随机的。

全部模型加起来也不大，就37MB左右。

请问，这很有可能是什么原因造成的？以及怎么处理？

Answer 1

5.10 之前就已经被这个问题困扰了，现在终于解决了，此问题历经2个星期。
期间，什么改变模型大小、位置、循环方式、模型数量、模型体积等等都一一尝试过，直到重新把目光放回到load这个方法上面。

因为我要加载的是IFC模型，所以用的是IFCLoader。而这个IFC.js后续的接口都是要通过modelID这个属性值去查找和获取的。
然后，我发现返回的IFCmodel，里面的modelID都是一样的，很有可能就是渲染的时候就把它们都当作同一个模型了，进行的是替换渲染，所以无论有多少模型，最后都是只渲染一个。

经过排查，发现模型文件数据是没有问题的，那么很大可能就在load的时候出现的问题。再进一步把渲染逻辑理清后发现，如果每一次加载渲染的时候，都是一个重复的加载器对象的话，那么就会出现ID重复这个问题。
原先，我是设置了一个全局的加载器对象

let ifcLoader = new IFCLoader(); 
ifcLoader.load();

后面更正为在每一个循环里面重新构建

// 此处外层套个循环
loadIfcModel() {
    let ifcLoaderObj = new IFCLoader();
    ifcLoaderObj.load();
}

然后还是不太行的样子，又进一步优化为

// 此处外层套个循环
loadIfcModel() {
    new IFCLoader().load();
}

最后，就解决了......没想到会这么简单的就解决了......有点怅然若失。