基于WebGL 的高速公路BIM 模型輕量化方法研究

吳學(xué)明，梁禮繪，嚴(yán) 磊，劉增輝

（1. 中國(guó)電建集團(tuán)昆明勘測(cè)設(shè)計(jì)研究院有限公司，云南 昆明 650000，E-mail：402766794@qq.com；2. 天津大學(xué) 水利工程仿真與安全國(guó)家重點(diǎn)實(shí)驗(yàn)室，天津 300350）

近年來(lái)，BIM技術(shù)應(yīng)用持續(xù)推進(jìn)，面對(duì)大體量的 BIM 模型在存儲(chǔ)和傳輸時(shí)具有的諸多不便且需要配合體積龐大、功能復(fù)雜的專業(yè)軟件進(jìn)行可視化的局面，傳統(tǒng)C/S架構(gòu)下的平臺(tái)逐漸被基于B/S架構(gòu)的系統(tǒng)所取代。隨著三維可視化技術(shù)和Web端技術(shù)的不斷發(fā)展，BIM模型輕量化顯示的需求與傳統(tǒng)對(duì)C/S端軟件的依賴越發(fā)矛盾，管理人員迫切希望能夠?qū)崿F(xiàn)BIM模型的實(shí)時(shí)顯示瀏覽，同時(shí)，WebGL的不斷發(fā)展也加速推進(jìn)Web端的三維可視化技術(shù)。WebGL技術(shù)是一套圖形標(biāo)準(zhǔn)庫(kù)，包含了HTML5和JavaScript技術(shù)，它在進(jìn)行圖像渲染的同時(shí)可以直接調(diào)用底層GPU顯卡指令集，而且能夠兼容PC端和移動(dòng)端瀏覽器[1]。

伴隨著Three.js等[2]WebGL架構(gòu)的不斷完善，其技術(shù)應(yīng)用量也逐年遞增。臺(tái)灣國(guó)立大學(xué)通過(guò)WebGL技術(shù)和云計(jì)算的結(jié)合實(shí)現(xiàn)了建筑信息的三維建模。劉曉俊等[3]提出了一種基于Web3D的大規(guī)模BIM場(chǎng)景實(shí)時(shí)可視化的輕量化解決方案。在數(shù)據(jù)分析處理方面的研究中，一些研究人員采用對(duì)比IFC相似度的方法來(lái)實(shí)現(xiàn)文件壓縮。Kereshmeh Afsaria等[4]提出ifcJSON文檔可替代XML文檔用于基于Web的數(shù)據(jù)傳輸。高喆[5]在進(jìn)行Web端渲染時(shí)采用了設(shè)置WebGL-RM模塊的方法。Web三維可視化的發(fā)展和國(guó)內(nèi)外的研究雖然為 BIM 和WebGL結(jié)合提供了相似的研究思路，但是缺少更深入的轉(zhuǎn)換方法[6,7]。而且目前關(guān)于 BIM 技術(shù)和WebGL結(jié)合的理論研究還處在起始階段，研究的重點(diǎn)也是針對(duì)WebGL技術(shù)應(yīng)用本身，缺少兩者的有效結(jié)合，現(xiàn)有的轉(zhuǎn)換方法在渲染效率也比較低。而對(duì)比傳統(tǒng)數(shù)據(jù)格式FSV和XML，JSON因其簡(jiǎn)單編碼和支持于各種語(yǔ)言、便宜的序列化和反序列化，使其更易于使用且傳輸效率更高[8]。因此本文采用Revit二次開(kāi)發(fā)實(shí)現(xiàn)JSON轉(zhuǎn)換格式，并通過(guò)WebGL技術(shù)，進(jìn)行基于WebGL的高速公路BIM模型輕量化方法研究。

1 W eb端模型重構(gòu)技術(shù)理論

1.1 三維模型顯示技術(shù)

模型輕量化管理的關(guān)鍵與核心是實(shí)現(xiàn) Web端三維模型重建與渲染[9]，此過(guò)程需要進(jìn)行一系列變換操作，主要有空間幾何和投影變換等。

1.1.1 空間幾何變換

假設(shè)頂點(diǎn)M（x，y，z），其經(jīng)過(guò)圖形操作后得到點(diǎn)M1（x1，y1，z1），具體變換方式如下：

（1）平移變換。頂點(diǎn)依據(jù)向量T平移，平移后M（x，y，z）和M1（x1，y1，z1）關(guān)系如下：

（2）旋轉(zhuǎn)變換。旋轉(zhuǎn)變換即圖形繞著某旋轉(zhuǎn)軸，在指定方向進(jìn)行的指定角度的旋轉(zhuǎn)，當(dāng)M（x，y，z）是繞z軸逆時(shí)針旋轉(zhuǎn)θ度后得到頂點(diǎn)M1（x1，y1，z1），則兩者的關(guān)系如下：

（3）縮放變換?？s放變換需設(shè)置縮放因子，設(shè)x、y、z軸的縮放因子分別為px、py、pz，則M1和M的關(guān)系式如下：

1.1.2 投影變換

三維模型進(jìn)行 Web的渲染顯示需要通過(guò)投影變換將三維空間坐標(biāo)映射到二維屏幕坐標(biāo)來(lái)實(shí)現(xiàn)。三維模型的投影變換主要有正交和透視投影兩種。正交投影的特點(diǎn)是模型在投影前后的各部分在顯示的時(shí)候是同比例的，而透視投影后的模型顯示根據(jù)各部分的遠(yuǎn)近發(fā)生變化，其顯示結(jié)果與人眼的觀察情況基本一致，在VR場(chǎng)景漫游中應(yīng)用較多。

基本投影模型由視點(diǎn)和視平面組成，視點(diǎn)為視平面外的相機(jī)鏡頭對(duì)著物體方向的點(diǎn)，視平面即為屏幕上的投影面。另外，計(jì)算機(jī)圖形學(xué)一般規(guī)定視平面可視區(qū)域形狀為矩形，并通過(guò)定距使得可視區(qū)域?yàn)殄F形體，視椎體基本投影模型如圖1所示。

圖1 透視投影的視椎體模型

將三維坐標(biāo)系中的坐標(biāo)原點(diǎn)設(shè)為視點(diǎn)V，顯而易見(jiàn)，視平面是垂直于z軸的，x、y軸分別垂直于兩平行邊，此類模型統(tǒng)稱為標(biāo)準(zhǔn)模型，標(biāo)準(zhǔn)模型與一般模型的轉(zhuǎn)換?？赏ㄟ^(guò)下式可進(jìn)行。

式中，其中Pview為一個(gè)轉(zhuǎn)換矩陣，它代表著透視投影從一般模型到標(biāo)準(zhǔn)模型的轉(zhuǎn)換；X代表一般模型中的點(diǎn)；Y為標(biāo)準(zhǔn)模型中的點(diǎn)；V為視點(diǎn)；R為姿態(tài)。

對(duì)于透視模型的標(biāo)準(zhǔn)模型，其坐標(biāo)原點(diǎn)為視平面中心，如圖2所示，x、y軸的位置關(guān)系為標(biāo)準(zhǔn)坐標(biāo)系；而屏幕坐標(biāo)模型的原點(diǎn)在左上角，y軸朝向下方，x軸和前者視平面坐標(biāo)方向一致（見(jiàn)圖3）。因此，需要進(jìn)行坐標(biāo)的轉(zhuǎn)換。

圖2 視平面坐標(biāo)模型

圖3 屏幕坐標(biāo)模型

這里設(shè)wp、hp、ws、hs，分別用來(lái)表示視平面的寬度和高度以及屏幕寬度和高度，由于屏幕坐標(biāo)系是離散坐標(biāo)系，則已知屏幕右下點(diǎn)坐標(biāo)為（ws-1，hs-1），則可得出視平面中的（0，0）點(diǎn)對(duì)應(yīng)屏幕坐標(biāo)的中心點(diǎn)坐標(biāo)，為（0.5ws-0.5，0.5hs-0.5）。這里列出視平面坐標(biāo)與屏幕坐標(biāo)的轉(zhuǎn)換關(guān)系，如下式：

1.2 WebGL渲染技術(shù)

1.2.1 WebGL渲染原理

利用 WebGL技術(shù)可以進(jìn)行圖元繪制和場(chǎng)景渲染，這些操作是通過(guò)調(diào)用底層驅(qū)動(dòng)來(lái)實(shí)現(xiàn)的，GPU采用流水線的結(jié)構(gòu)來(lái)處理應(yīng)用程序發(fā)送的圖形數(shù)據(jù)，并對(duì)其進(jìn)行階段傳遞，最后寫(xiě)入幀緩存。其中WebGL的渲染管線機(jī)制為三維模型的Web端渲染提供重要的技術(shù)支持，如圖4所示。

圖4 WebGL渲染管線機(jī)制

渲染流水線可簡(jiǎn)要概括以下幾點(diǎn)：

（1）頂點(diǎn)數(shù)據(jù)處理。對(duì)所有頂點(diǎn)計(jì)算顏色值并進(jìn)行坐標(biāo)變換，把坐標(biāo)和顏色放入緩存區(qū)。

（2）裁剪和圖元裝配。對(duì)頂點(diǎn)進(jìn)行線裝組裝，形成線段圖元，并對(duì)相機(jī)可視范圍內(nèi)圖元進(jìn)行裁剪。

（3）光柵化?？梢詫D元轉(zhuǎn)換為二維圖像，效果為形成包含顏色、紋理等信息的片元作用于像素點(diǎn)。

（4）片元處理。確定幀緩存中每個(gè)像素的顏色值，為屏幕顯示做準(zhǔn)備。

1.2.2 WebGL渲染流程

WebGL在Web端的渲染流程與OpenGL相像[10]。首先是創(chuàng)建WebGL上下文對(duì)象，此對(duì)象與WebGL繪圖緩沖區(qū)交互，同時(shí)能夠調(diào)用所有WebGL方法，然后可以定義頂點(diǎn)和其他相關(guān)著色器及其初始化。在進(jìn)行正式繪制之前，還需要對(duì)其背景顏色進(jìn)行自定義。

WebGL作為一套結(jié)合HTML5和JavaScript技術(shù)的圖形標(biāo)準(zhǔn)庫(kù)，無(wú)需任何插件就能夠跨平臺(tái)進(jìn)行三維圖形的 Web端高速加載渲染和實(shí)現(xiàn)由 C/S到B/S框架的可視化方式，這些優(yōu)異的特性為BIM輕量化提供了重要的技術(shù)支持。

1.3 三角網(wǎng)格數(shù)據(jù)結(jié)構(gòu)

模型構(gòu)件可劃分為有限個(gè)三角網(wǎng)格（各個(gè)點(diǎn)集組成），網(wǎng)格三角面之間的連接會(huì)出現(xiàn)很多的重合頂點(diǎn)，通過(guò)將頂點(diǎn)和網(wǎng)格三角面信息儲(chǔ)存為數(shù)組形式的數(shù)據(jù)結(jié)構(gòu)，可以實(shí)現(xiàn)模型信息的壓縮卻不丟失點(diǎn)面信息。

1.3.1 面三角網(wǎng)格數(shù)據(jù)結(jié)構(gòu)

本著實(shí)現(xiàn)數(shù)據(jù)存儲(chǔ)簡(jiǎn)單易理解的目的，對(duì)三角網(wǎng)格頂點(diǎn)信息的儲(chǔ)存采用三角形剖分面的順序進(jìn)行，例如V1、V2、V3的F1，V1、V3、V4的F2等。這樣做可降低法向數(shù)據(jù)存儲(chǔ)量，但對(duì)于基于面的三角網(wǎng)格模型數(shù)據(jù)結(jié)構(gòu)，會(huì)出現(xiàn)頂點(diǎn)重復(fù)保存而造成數(shù)據(jù)冗余的問(wèn)題，如圖 5所示，頂點(diǎn)V1、V3、V4在每個(gè)三角形面片中都會(huì)被儲(chǔ)存，頂點(diǎn)坐標(biāo)見(jiàn)表1。

圖5 三角網(wǎng)格示意圖

表1 三角網(wǎng)格頂點(diǎn)列表

1.3.2 共享頂點(diǎn)數(shù)據(jù)組織方法

這里提出的數(shù)據(jù)組織方法將數(shù)據(jù)存儲(chǔ)分為兩個(gè)部分進(jìn)行，核心是進(jìn)行頂點(diǎn)的共享。該方法擺脫了頂點(diǎn)重復(fù)存儲(chǔ)造成數(shù)據(jù)冗余的弊端，通過(guò)對(duì)頂點(diǎn)坐標(biāo)和三角面索引分別生成數(shù)組結(jié)構(gòu)，重復(fù)的頂點(diǎn)坐標(biāo)只存儲(chǔ)一個(gè)，所有頂點(diǎn)坐標(biāo)形成頂點(diǎn)坐標(biāo)數(shù)組用于與頂點(diǎn)索引對(duì)照，面信息里面只存儲(chǔ)對(duì)應(yīng)的頂點(diǎn)索引，這樣便建立了一一對(duì)應(yīng)的關(guān)系。此法簡(jiǎn)單方便，只需進(jìn)行頂點(diǎn)索引序號(hào)的存錄，就能夠?qū)崿F(xiàn)頂點(diǎn)序號(hào)和頂點(diǎn)坐標(biāo)一一對(duì)應(yīng)的方式建立關(guān)聯(lián)，同時(shí)也體現(xiàn)點(diǎn)之間的拓?fù)潢P(guān)系。如表2和表3所示。

表2 頂點(diǎn)索引表

表3 頂點(diǎn)數(shù)組列表

1.3.3 JSON數(shù)據(jù)結(jié)構(gòu)應(yīng)用

基于 JSON簡(jiǎn)單的信息存儲(chǔ)方式，其相對(duì)于XML和FSV具有內(nèi)容可讀性強(qiáng)、數(shù)據(jù)傳輸和解析速度快等優(yōu)點(diǎn)，所以在輕量級(jí)的B/S架構(gòu)中很適合采用此結(jié)構(gòu)進(jìn)行后臺(tái)與前端的數(shù)據(jù)交互。在數(shù)據(jù)處理后可將IFC標(biāo)準(zhǔn)定義的高速公路數(shù)據(jù)結(jié)構(gòu)轉(zhuǎn)換成三角網(wǎng)格數(shù)據(jù)結(jié)構(gòu)并以JSON格式進(jìn)行儲(chǔ)存，如高速公路構(gòu)件信息的JSON數(shù)據(jù)結(jié)構(gòu)可簡(jiǎn)單表示為：

{

“vertices”：[]，// 存錄轉(zhuǎn)換成三角網(wǎng)格的高速公路頂點(diǎn)

“indices”：[]，//存錄轉(zhuǎn)換成三角網(wǎng)格的高速公路頂點(diǎn)索引

“normals”：[]，//法向量

“colors”：[]，

“materials”：[]，// 儲(chǔ)存剖分面外觀信息

}

2 三維模型輕量化顯示

2.1 Revit-JSON接口實(shí)現(xiàn)

2.1.1 定義JSON數(shù)據(jù)接口

WebGL不能直接支持rvt格式文件，需要進(jìn)行文件格式的轉(zhuǎn)換，而JSON數(shù)據(jù)儲(chǔ)存采用鍵值對(duì)的方式，非常方便進(jìn)行解析且具有平臺(tái)無(wú)關(guān)和輕量化的特點(diǎn)，此外相對(duì)于傳統(tǒng)的 XML，其封裝、解析以及傳輸效率更高，因此本開(kāi)發(fā)采用JSON作為中間數(shù)據(jù)文件格式。

把Revit二次開(kāi)發(fā)導(dǎo)出的OBJ格式的高速公路幾何信息存入幾何區(qū)之前需要進(jìn)行數(shù)據(jù)格式方面的調(diào)整，此外，還需要在圖6所示屬性區(qū)存放高速公路模型 JSON格式對(duì)應(yīng)信息，然后將兩者通過(guò)JSON鍵值對(duì)統(tǒng)一標(biāo)識(shí)符一一對(duì)應(yīng)。

2.1.2 Revit二次開(kāi)發(fā)

圖6 中間文件結(jié)構(gòu)數(shù)據(jù)圖

首先設(shè)計(jì)高速公路的數(shù)據(jù)提取流程，主要分為定點(diǎn)數(shù)據(jù)、法線數(shù)據(jù)、材質(zhì)紋理數(shù)據(jù)3個(gè)方面，即高速公路模型定點(diǎn)數(shù)據(jù)提取、高速公路模型法線數(shù)據(jù)提取（對(duì)模型幾何信息進(jìn)行約束和修正）、高速公路模型紋理和材質(zhì)信息提取。如材質(zhì)信息，在IFC分層架構(gòu)下逐層獲取IFCELEMENT信息[11]。具體流程設(shè)計(jì)如圖7所示。

圖7 高速公路模型數(shù)據(jù)提取流程

高速公路模型數(shù)據(jù)提取后進(jìn)行Revit二次開(kāi)發(fā)，其核心技術(shù)是Revit對(duì)象轉(zhuǎn)換為JSON文件。具體分為兩個(gè)核心部分：

（1）幾何信息。將獲取到的高速公路對(duì)象導(dǎo)出為OBJ格式，保存在如圖6所示的幾何區(qū)，其中幾何信息獲取是通過(guò)Geometry來(lái)得到其Geometry Element實(shí)例，然后通過(guò)對(duì)其solid進(jìn)行遍歷得到實(shí)體，并對(duì)每個(gè)實(shí)體遍歷得到其面和邊，從而獲得其坐標(biāo)點(diǎn)。

（2）將獲取到的高速公路對(duì)象材質(zhì)屬性信息存放在JSON中間文件屬性信息區(qū)域。其中材質(zhì)屬性信息獲取通過(guò)數(shù)據(jù)導(dǎo)出類IExportContext自定義MyExport類，通過(guò)Onmaterial（）方法獲取材質(zhì)信息ID，得到ID就能得到material，然后就能獲取包含所有渲染信息的Asset對(duì)象。具體實(shí)現(xiàn)代碼如下：

IExportContext pExport=new MyExporter（）；

CustomExporter exporter = new CustomExporter

（doc，pExport）；

ElementId appearanceId=material.AppearanceAssetId；

AppearanceAssetElement

appearanceElem=document.GetElement

（appearanceId）as AppearanceAssetElement；

Asset

theAsset=appearanceElem.GetRenderingAsset（）；

ElementId Id =material.AppearanceAssetId；

//通過(guò)上面取得的AppearanceAssetId 得到

Appearance Asset Element AppearanceAssetElement

Elem=document.GetElementId as

AppearanceAssetElement；

//獲得 Asset

Asset Asset=Elem.GetRenderingAsset（）；

兩核心步驟的具體實(shí)現(xiàn)方式如圖8所示。

圖8 二次開(kāi)發(fā)流程圖

2.2 Web端重建與渲染

鑒于Three.js框架進(jìn)行模型可視化顯示的優(yōu)異性能表現(xiàn)[12]，因此本文采用Three.js進(jìn)行Web端的功能開(kāi)發(fā)。前文導(dǎo)出的高速公路JSON格式中間文件包括幾何信息、材質(zhì)和紋理三部分，將外部文件導(dǎo)入Three.js來(lái)進(jìn)行三維場(chǎng)景創(chuàng)建。

（1）進(jìn)行三維場(chǎng)景構(gòu)建，這里通過(guò)THREE.Mesh函數(shù)來(lái)實(shí)現(xiàn)，其包含兩個(gè)參數(shù)，其中幾何關(guān)系由Geometry類定義，可獲取頂點(diǎn)和片面數(shù)組信息，Material類定義材質(zhì)屬性信息，然后借助函數(shù)gl.texlmage2D來(lái)進(jìn)行后續(xù)的材質(zhì)信息操作（該函數(shù)功能是根據(jù)指定的參數(shù)來(lái)生成2D紋理并上傳）。

（2）通過(guò)Three.js進(jìn)行三維渲染。創(chuàng)建Scene進(jìn)行對(duì)象容納，通過(guò)JS異步加載JSON文件進(jìn)行解析生成Geometry并生成Mesh模型，再放入Scene場(chǎng)景中進(jìn)行加載。JSON文件解析步驟如圖9所示。

圖9 JSON文件解析步驟

通過(guò)parseGeometries（）函數(shù)對(duì)Geometries集合中 type屬性進(jìn)行遍歷，并通過(guò) THREE.JSONLoader函數(shù)對(duì)引入場(chǎng)景的 Revit二次開(kāi)發(fā)后的高速公路JSON格式文件解析。在進(jìn)行上述操作之后，完成在 Render內(nèi)的場(chǎng)景渲染。在此重點(diǎn)分析高速公路JSON中間文件的解析和加載，對(duì)場(chǎng)景引入基本的光源、相機(jī)等的著色、渲染不再進(jìn)行詳細(xì)說(shuō)明。

3 屬性關(guān)聯(lián)與輕量化分析

3.1 屬性關(guān)聯(lián)

高速公路 BIM 模型屬性數(shù)據(jù)包含其結(jié)構(gòu)和工程屬性，但前文獲取的高速公路JSON文件中的幾何和屬性數(shù)據(jù)是分別儲(chǔ)存在JSON中間文件的幾何數(shù)據(jù)和屬性數(shù)據(jù)區(qū)域，為了實(shí)現(xiàn)Web端屬性信息查詢，本文通過(guò)設(shè)置統(tǒng)一標(biāo)識(shí)符UID進(jìn)行兩區(qū)域數(shù)據(jù)信息關(guān)聯(lián)，然后進(jìn)行Web端匹配標(biāo)識(shí)符實(shí)現(xiàn)屬性信息顯示。

Three.js對(duì)接收到的JSON文件進(jìn)行處理，通過(guò)OBJ解析器將幾何數(shù)據(jù)解析生成三維模型，并通過(guò)UID關(guān)聯(lián)儲(chǔ)存在內(nèi)存中的屬性信息。通用交互實(shí)現(xiàn)方式為鼠標(biāo)點(diǎn)擊查詢，這里需要用到 WebGL的Canvas節(jié)點(diǎn)渲染，因此需要進(jìn)行Canvas內(nèi)部子對(duì)象的獲取。這里通過(guò)鼠標(biāo)點(diǎn)擊獲取瀏覽器窗口二維坐標(biāo)，然后進(jìn)行三維坐標(biāo)的轉(zhuǎn)換并與三維模型的幾何對(duì)象進(jìn)行匹配，從而獲取其UID值，然后通過(guò)唯一標(biāo)識(shí)符 UID與存儲(chǔ)的屬性信息進(jìn)行匹配即可實(shí)現(xiàn)屬性信息在HTML頁(yè)面的顯示，某高速公路BIM模型項(xiàng)目策劃屬性信息獲取實(shí)例如圖10所示。

3.2 輕量化分析

實(shí)現(xiàn)高速公路 BIM 模型的輕量化即實(shí)現(xiàn)高速公路 BIM 模型對(duì)系統(tǒng)環(huán)境配置依賴性的降低和模型數(shù)據(jù)文件體量的壓縮，具體分析如下：

圖10 某高速公路BIM模型項(xiàng)目策劃屬性信息獲取

（1）高速公路BIM模型對(duì)系統(tǒng)環(huán)境要求。傳統(tǒng)基于Revit的可視化平臺(tái)，需要高配置的電腦軟硬件來(lái)支持，而基于WebGL的高速公路BIM模型輕量化方法是基于Web端的可視化平臺(tái)，可同時(shí)兼容多版本瀏覽器和移動(dòng)端，在平臺(tái)顯示方面實(shí)現(xiàn)了便宜輕量化。同時(shí)，鑒于通過(guò)WebGL進(jìn)行高速公路模型的渲染重構(gòu)時(shí)會(huì)對(duì) GPU資源消耗，本文通過(guò)表示渲染流暢度的幀率FPS來(lái)進(jìn)行簡(jiǎn)易衡量（一般FPS值達(dá)到30即可實(shí)現(xiàn)流暢的可視化查詢和交互操作），測(cè)試顯卡型號(hào)為NVIDIA Quadro K2100M，根據(jù)Three.js的性能監(jiān)視器進(jìn)行管理渲染性能。

（2）模型文件大小調(diào)整。由于高速公路可視化信息查詢對(duì)于其模型的精細(xì)度要求不是很高，所以在保證模型信息完整度達(dá) 90%且符合管理者的可視化要求的情況下，可以實(shí)現(xiàn)一定水平的數(shù)據(jù)文件壓縮；此外通過(guò)采用共享頂點(diǎn)的數(shù)據(jù)組織方法來(lái)去除冗余重復(fù)的頂點(diǎn)數(shù)據(jù)，實(shí)現(xiàn)了頂點(diǎn)數(shù)據(jù)的極致精簡(jiǎn)，也可以達(dá)到縮小內(nèi)存占用的目的，從而實(shí)現(xiàn)高速公路BIM模型的輕量化Web端顯示。

4 結(jié)語(yǔ)

本文通過(guò)基于Revit二次開(kāi)發(fā)的模型格式轉(zhuǎn)換和優(yōu)化的模型數(shù)據(jù)組織形式，得到支持WebGL的輕量化JSON數(shù)據(jù)文件，并通過(guò)對(duì)WebGL原理和Three.js框架的研究使用，實(shí)現(xiàn)可視化操作的平臺(tái)移植和BIM模型在Web端的重建渲染、屬性查詢等操作，滿足高速公路BIM模型輕量化管理的Web端實(shí)時(shí)三維交互查詢的要求，達(dá)到了預(yù)期目標(biāo)。此外，本文相較于傳統(tǒng)的C/S架構(gòu)，在實(shí)現(xiàn)Web端實(shí)時(shí)可視化的同時(shí)降低了系統(tǒng)復(fù)雜度和對(duì)硬件的需求，針對(duì)前人使用FSV和XML格式渲染效率不高的問(wèn)題，使用通過(guò)Revit二次開(kāi)發(fā)后得到的編碼簡(jiǎn)單、序列化和反序列化更方便的JSON數(shù)據(jù)文件，大大提升了數(shù)據(jù)傳輸和渲染效率，實(shí)現(xiàn)了模型數(shù)據(jù)基于WebGL技術(shù)的Web端實(shí)時(shí)高效渲染。