使用ThreeJs搭建BIM模型浏览器,第九步-内存优化(1)
首页 > 网站建设 > 转载   作者:玉龙之乡  2020年10月16日 7:06 星期五  热度:4141°  字号:   评论:0 条
时间:2020-10-16 7:06   热度:4141°  评论:0 条 

添加到场景的mesh,是通过geometry+materail生成的。如果场景内大量重复的构件,或者大量的构件的材质都是相同的,threejs提供这种方案节省内存:共享geometry 和materail。举例说明:

创建300个一样的圆,一般情况可能会写成下面这样


	
  1. for (let i = 0; i < 300; i++) {
  2. let geometry = new THREE.BoxGeometry(10, 10, 10);
  3. let material = new THREE.MeshLambertMaterial({color: 0x00ffff});
  4. let mesh = new THREE.Mesh(geometry, material);
  5. mesh.position.set(THREE.Math.randFloatSpread(200), THREE.Math.randFloatSpread(200), THREE.Math.randFloatSpread(200));
  6. group.add(mesh);
  7. }

优化的方法是这样写:


	
  1. let geometry = new THREE.BoxGeometry(10, 10, 10);
  2. let material = new THREE.MeshLambertMaterial({color: 0x00ffff});
  3. for (let i = 0; i < 300; i++) {
  4. let mesh = new THREE.Mesh(geometry, material);
  5. mesh.position.set(THREE.Math.randFloatSpread(200), THREE.Math.randFloatSpread(200), THREE.Math.randFloatSpread(200));
  6. group.add(mesh);
  7. }

注意了,大佬的博客都点到为止,不会告诉你这样的弊端,你一试就知道在BIM浏览器这样做会存在的问题!

因为所有的构件都共享了materail,你怎么实现点击选中,点击选中之后给构件赋予颜色,结果所有同类构件都被渲染成相同的颜色!因为materail是共享的,对materail改个颜色会感觉被选中了一大片。

解决思路很简单,简单到我都没代码可分享:针对选中的构件(或者要赋予颜色的构件),临时替换一个materail即可(曲线救国)!

以前每个构件的纹理材质单独创建时,可以直接赋予颜色,如下图:

现在赋予颜色可以新建一个material给它。当然material新建之后也要管理好,以免内存膨胀;旧的材质纹理要缓存起来,用于恢复默认。相当于给构件弄了个新的包装盒,旧的也别丢掉,还要用的。

Revit自带的这个模型叫做Arch Link Model.rvt,它的材质有点多,有42种,即使这样也明显节省了20%的内存。如果是机电专业,管道设备几乎不在意材质,都是通用的材质纹理,一共就不需要创建几个material,估计会有惊喜。

这是第一步内存优化,针对材质纹理的。后面还会针对Revit导出的几何体进行分析,计算相同形状的构件,以实现文件的压缩和前端的提效。

 您阅读这篇文章共花了: 
捐赠支持:如果觉得这篇文章对您有帮助,请“扫一扫”鼓励作者!
 本文无需标签!
二维码加载中...
本文作者:玉龙之乡      文章标题: 使用ThreeJs搭建BIM模型浏览器,第九步-内存优化(1)
本文地址:http://nmgjz.com/post-159.html
版权声明:若无注明,本文皆为“玉龍之鄉”原创,转载请保留文章出处。

返回顶部    首页    手气不错    捐赠支持   后花园   
版权所有:玉龍之鄉    站长: 玉龙之乡   程序:emlog   蒙ICP备16004298号