基于Web流式加载的BIM轻量化技术研究与应用

饶平平 赵思凡 张学亮

(1.上海理工大学 环境与建筑学院，上海 200093； 2.同纳检测认证集团有限公司，上海 200331)

引言

当前，国内外工程应用各阶段对BIM的需求呈现出从静态的、交互性差的模型展示转向共享化、网络化的趋势[1]。BIM技术虽然早已应用于建筑行业，但在初期很多工程交付过程中，仍以BIM本地文件的形式进行数据传递，再通过安装特定的客户端软件查看模型。这些模型数据量大且传递方式不实时，从而大大降低了BIM技术在工程应用中的便捷性[2]。

在BIM模型轻量化方面，Autodesk Revit 软件系列的模型存储为rvt 格式； 晁阳等[3]通过将BIM模型导出为fbx格式文件实现Web端可视化，但轻量化程度远远不够且浏览器渲染效果一般；薛建英等[4]将Revit模型转化为json格式文件，进行浏览器的渲染，但轻量化强度仍达不到工程广泛使用的要求； 杨李东等[5]研究了3D Tiles 相关的数据转换技术，由于数据结构较复杂，轻量化效果不理想； 吕婧等[6]通过将Revit模型转化为gltf格式文件，实现了模型数据的轻量化，但却未深入考虑各专业模型转化的适用性问题。

近年来，众多BIM工作团队为提高模型查看效率开展了一系列研究。例如，BIMFACE[7]尝试网络端BIM显示，同时需要用户将模型上传至其服务器，再通过模型在线转换调取文件API接口进行网页开发，才能实现客户端对BIM模型的浏览； 鲁班等团队[8]研发的平台需要同样的逻辑操作，这些操作虽然初步实现了模型轻量化Web端展示，但用户使用仍受制于特定的客户端及平台。除此之外，直接将工程信息上传到第三方平台会对重大工程的信息保护构成很大威胁。

基于此，本文使用BIM模型轻量化转换方案，搭载Web流式加载技术，结合工程实际应用需求，统一了文件格式和数据结构，优化了模型渲染技术，设计了工程数据筛选思路，实现了基于Web端轻量化平台展示流畅的渲染效果，对BIM轻量化方案作出了一定的优化，提高了BIM模型查看效率和平台使用流畅度，使其更加满足实际工程应用需要。

1 BIM轻量化理论研究

未来的BIM应用会趋于轻量化，这一趋势最明显的变化就是由厚重的客户端向Web端转变的过程。由于Web端无法直接处理rvt文件，Revit模型需要经过转换才能在Web端显示。而Web端支持的模型格式较为广泛，如xml、obj、3ds、json、dae、gltf等格式。其中，gltf能用于许多系统的数据交换，也满足服务器与客户端之间的数据交换格式，并且相对来说数据量很小，是BIM数据从客户端向Web端转型的重要形式之一。

本文轻量化技术选择“gltf格式数据+流式加载”的轻量化模式，在实现BIM应用模块整体轻量化的同时，还保证了数据的完整性、平台的流畅性及稳定性。

1.1 BIM模型数据轻量化

gltf(GL Transmission Format)是由 Microsoft与Khron os 3D 公司共同推出的应用于网络传输的三维模型文件格式，且被大多数浏览器渲染引擎所支持，可以加载gltf格式模型文件，例如Three.JS、Cesium.JS等。在3D内容的传输和加载过程中，gltf通过提供高效、可协作和易扩展的格式填补了3D 建模工具和现代Web应用程序之间的空白。使用gltf的用户可以使用现有工具来处理模型并减少模型中的数据量，无需经过多余的客户端或平台进行模型展示。

gltf的本质是一种易于Web端解析的 json文件+数据，该文件描述了3D场景的结构和组成，其中包含模型的节点层次、材质、相机、网格、着色器及动画等相关逻辑结构，应用程序通过读取这些信息对模型的环境和场景参数进行设置。

图1 gltf数据结构图

gltf的数据结构简单，内存占比较小。如图1所示，gltf数据主要分为三大模块：几何模块、数据模块和表层模块。几何模块中json文件主要描述模型完整的场景，包括节点、材质、相机和网格等； 数据模块中bin文件主要包含几何和动画数据； 表层模块由图像文件组成，用于图片纹理的显示。

1.2 流式轻量化加载方式

浏览器有两种方式加载gltf模型：对于简单模型，将Model视作几何体直接加载，方法简单，效果单一且适用性差； 对于复杂建筑群、大型场地等，采用多样化属性加载方式。浏览器加载文件过程中，Model有四种状态：加载模型、解析数据、数据反馈及绘图。

图2所示为流式加载过程：首先解析中间数据json文件，进行初步的模型结构构建； 其次解析gltf具体数据，将数据(纹理、顶点、材质属性等)赋值给模型各个结构； 再者浏览器进行数据解析并反馈数据至渲染队列； 最终由绘图指令(Drawconnand)绘制Web端3D图形。

图2 浏览器加载GLTF流程

对于密集建筑群与大型场地，如果一次性加载所有建筑，会造成内存紧张甚至崩溃，正如很多BIM客户端软件在大型工程中会出现加载卡顿、死机的情况。针对这一问题，传统的处理方式是LOD[9](Levels of Detail，细节层次法)处理技术，它认为当模型覆盖面积很小时，可以使用较粗的物体来描述模型，对被遮挡的物体使用简模展示，并给出了算法判定几何层次，从而让计算机快速绘制出复杂场景模型。但是，由于视角一直在建筑中来回切换，不同LOD模型也会随之切换，造成占用相对较大的内存。而浏览器的流式加载相比于传统客户端直接加载模型方式，其优势在于它可以在保证快速加载出静态模型的前提下，流畅地进行动态模型加载； 同时可以根据视角的时空位置，只加载当前一定范围内的场景，并且利用多余的内存提前加载后续一定空间的场景，在视角切换到下一空间时，继续循环进行之前的加载操作。

1.3 模型数据筛选思路

对于BIM模型的Web端可视化过程，可以根据BIM应用的需求，筛选转换后的各类模型数据，进一步轻量化模型数据。对于一般BIM应用的开发需求，在模型转换时，可以仅选取最基本的模型空间、纹理等形态数据； 对于重大项目或对安全性、保密性有特殊要求的项目，可以只提供3D场景及工程应用所需的基本数据，筛除工程隐私数据，保障BIM模型共享数据的安全性； 对于复杂应用环境的工程项目，可以同时开发两种不同的模型平台，从BIM数据源头保证数据的安全性。

2 glTf-BIM模型轻量化开发流程

2.1 BIM数据转换格式分析

BIM模型数据格式种类繁多，但考虑到模型文件需要在Web端良好显示，目前主流的格式转换方案是将模型导出为obj、3Dtiles、gltf等格式。

表1 各格式3D模型性能对比表

基于上海理工大学优秀历史建筑群的案例，本文以别墅群中的小洋楼205为例，图3所示为在格式转换后导出rvt、obj和gltf格式文件的数据大小对比，其数据特点如表1所示。

通过小洋楼205不同格式的数据大小对比和3D模型性能对比，得出以下判断：rvt文件数据量大，兼容性差，在BIM产品应用过程中包袱厚重，限制较多； 而gltf文件的数据量最小，205模型的gltf数据大小仅为初始rvt数据的9.47%，rvt-gltf方案的模型转化效率明显高于其他方案； 且相比于obj文件，gltf文件具有数据量更小，数据信息更完整的特点，gltf文件更适用于Web端模型显示。

图3 小洋楼205各数据格式数据量

2.2 BIM-gltf模型生成方法

前文基础确定了本文的数据转换方案为rvt-gltf，在之前的研究中，有许多转换出gltf格式文件的方案。例如徐敬海[10]等通过已有开源工具ifcConvert将IFC文件转化为obj格式文件，再通过obj2gltf开源库实现obj向gltf格式文件的转化。边根庆[11]等通过调用Revit API，使用Revit2gltf实现gltf格式文件输出。本文通过较为成熟的Revit2gltf开源库，实现rvt-gltf转换方案。

2.3 开发流程

研究思路：建立Revit模型，Revit二次开发导出gltf+bin，在Three.js引擎渲染Web端模型，最后进行平台功能设计。

由Revit二次开发导出gltf+bin文件集：首先搭建Revit二次开发环境，安装Revit 2018+Visual Studio Code 2019，下载Revit SDK 2019，配置AddinManager及Revit Lookup二次开发插件。提取数据需要依赖Revit的sdk、c#引用链接库RevitAPI.dll、RevitDBAPI.dll，实现IExportContext接口。

在Three.js引擎渲染Web端模型：Three.js是基于WebGL发展起来的一套Web3D引擎，它对WebGL进行了封装，开发者不需要了解图形渲染的细节，只需要调用其接口二次开发就可实现基础的3D展示。本文选择开发环境为2019版vscode。具体开发流程图如图4所示：

图4 平台开发流程图

3 glTf-BIM轻量化效果展示

3.1 基于WebGL 技术的三维渲染效果

模型同样选择上海理工大学小洋楼205为例，根据已经获得的小洋楼205的rvt、obj、gltf数据格式，利用WebGL技术，搭载Three.js框架，基于Visual Studio 2019开发环境，进行初步的模型Web端显示，并对比分析三种模型显示效果如图5所示。

(a)rvt格式模型显示效果

三种显示效果均在同一设备、同一初始状态下进行，网络环境一致且正常，图5(a)是rvt文件在Revit软件中的显示效果，模型加载耗时7.36s，构件显示较为清晰，但交互操作严重卡顿； 图5(b)是obj文件在Web端展示效果，加载耗时0.28，交互操作流畅，但缺乏内部细节与纹理等关键信息，与原模型外观差别较大；图5(c)是gltf文件在Web端显示结果，加载耗时0.17s，交互操作流畅，与原模型外观一致。

3.2 三维模型的交互操作

平台在开发时，功能设计上需要实现三维场景的交互操作。为了使用鼠标操作三维场景，本平台借助Three.js众多控件，并引入控件OrbitControls.js，通过相关代码的编写，实现模型的Web端缩放、旋转与平移等操作。三维模型交互操作如图6所示，表2为具体鼠标操作方法。

基于Web流式加载方式，在鼠标操作场景变换过程中，总是能够保持流畅的场景切换和顺滑的操作过程，相比于笨重的客户端全模加载经常卡顿死机的情况，模型流式加载方式能够提高用户体验，提高BIM工作效率。

(a)原图

表2 鼠标操作方式及效果

3.3 BIM轻量化平台设计

基于BIM轻量化手段与互联网技术，本文将厚重的客户端BIM应用进行了网页端的开发，并初步设计了一套智慧园区工程管理平台。平台分为项目总览、BIM模型、实时监控、现场监测、人员管理、车辆管理、技术管理、质量管理、安全管理、进度管理、成本管理、大型设备及材料管理等十三个功能模块。

在BIM轻量化平台的设计上，选择BIM模型作为界面主要元素，周边搭载工程信息、监测信息、预测信息及管理信息等功能窗口。

基于Web端的轻量化BIM应用平台，可以随时随地将工程信息分享给工程相关人员，并且支持在线浏览模型、查看工程基本信息等操作，协助工程人员及时了解工程施工进度、安全等关键信息。

图7 智慧园区项目总览模块

4 结论与展望

初步研究分析表明，在BIM模型Web端展示过程中，gltf模型效果最佳，具有数据量小、显示效果好与兼容性强等特点。Web端的流式加载方式适用于复杂的工程建筑模型，在模型静态显示和动态操作方面表现优异。

在新时代BIM发展中，单一的可视化不足以满足实际使用的需求，轻量化是目前BIM发展的趋势之一，在当前注重时效性和信息传递量的工程背景下具有重要意义。

本轻量化平台功能的落实还需要依靠后续的项目推进，在功能设计上还有优化的空间。后续可以继续挖掘BIM数据的价值，实现Web端自动建模，一键工程算量等应用功能，充分发挥BIM数形结合的价值。