【three.js】scene有多个模型,却只渲染出一个,如何解决?

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

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

image.png

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

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

阅读 2.3k
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();
}

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

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题