謝曉(北京華油信通科技有限公司，北京 100000)

0 引言

石油化工行業(yè)是國民經(jīng)濟建設(shè)的基礎(chǔ)，基于WebGL的石油化工三維模型的建設(shè)[1]，可將石油行業(yè)的各種三維設(shè)計模型數(shù)據(jù)、屬性數(shù)據(jù)進行高度融合，實現(xiàn)可視化和多維表達[2]。由于石油化工模型特有特性，存在大量重復(fù)性部件進行建模，造成大量的模型建模工作。為實現(xiàn)大型煉化裝置模型中，局部小量模型裝置重復(fù)的部件渲染，降低這些小型的模型裝置因重復(fù)渲染而造成的系統(tǒng)資源性能占用，從而導(dǎo)致石油煉化模型裝置的剩余部分裝置分布不到足夠的處理資源，勢必導(dǎo)致石油化工模型的三維面量過大而導(dǎo)致的模型加載效率緩慢，迫切需要采用新的建模技術(shù)進行石油化工模型結(jié)構(gòu)化建模。

伴隨著WebGis模型渲染處理技術(shù)的逐步發(fā)展，地理信息化展現(xiàn)的方式也逐步由二維轉(zhuǎn)向三維，想要在三維WebGis系統(tǒng)前端中快速有效的渲染顯示模型數(shù)據(jù)[3]，成為目前三維空間GIS數(shù)據(jù)可視化的研究重要方向。目前對于石油化工模型的渲染和優(yōu)化技術(shù)的研究主要依托比較成熟的WebGL框架展開，主要依托瀏覽器把3D實體展示在網(wǎng)頁上，具體強大的擴展性，其中內(nèi)置的部分三維空間算法受到廣泛使用。基于WebGL，主要采用LOD分層級技術(shù)、幾何體實例化模型渲染等技術(shù)進行模型的渲染優(yōu)化，極大提高了石油化工模型的加載效率和渲染效果。

1 WebGL概述

WebGL(web graphics library)是一種3D繪圖協(xié)議，允許把JavaScript和OpenGL ES 2.0結(jié)合在一起，同時又可以為HTML5 Canvas提供硬件3D加速渲染，無需插件，通過此項技術(shù)，Web開發(fā)人員就能借助系統(tǒng)顯卡實現(xiàn)在瀏覽器里3D場景模型流程的展示。WebGL通過調(diào)動GPU進行硬件加速顯示模型，基于WebGL的3D圖形引擎主要有Three.JS、Babylon.JS、PlayCanvas、Cesium四種圖形引擎[4]。WebGL通過進行硬件的渲染加速，使得圖形渲染性能提高。在模型渲染引擎中，Three.JS偏向全面的模型展示，在小場景應(yīng)用中有不錯的性能，Babylon.JS，PlayCanvas偏向游戲制作，Cesium在大尺寸下的GIS應(yīng)用中優(yōu)勢明顯。

基于WebGL的應(yīng)用程序在傳統(tǒng)Web應(yīng)用的基礎(chǔ)，免去了開發(fā)網(wǎng)頁專用渲染插件的麻煩，可快速實現(xiàn)Web環(huán)境下的三維模型可視化渲染處理及優(yōu)化[5]。

2 WebGL環(huán)境下模型渲染優(yōu)化技術(shù)分析

2.1 基于LOD分層技術(shù)的模型數(shù)據(jù)優(yōu)化分析

了解決石油化工設(shè)計三維模型數(shù)據(jù)的實時可視化問題，建立了三維場景LOD可視化引擎，結(jié)合基于視點相關(guān)的LOD層次模型技術(shù)[6]，對原模型數(shù)據(jù)完成分層處理優(yōu)化，從而來減少原模型數(shù)據(jù)的數(shù)量，在通過對模型數(shù)據(jù)的渲染，完成每個LOD數(shù)據(jù)層的顯示，以減少模型數(shù)據(jù)的渲染率，實現(xiàn)了對大型裝置海量三維模型數(shù)據(jù)的有效管理及處置。同時，在保障三維模型部件清晰展示的前提下，采用該技術(shù)可對復(fù)雜的三維模型數(shù)據(jù)行之有效的簡化，提高了大型石油煉化模型數(shù)據(jù)的顯示效率，提升了可視化展示效果。通過采用上述方法，實現(xiàn)了對海量石油化工三維模型數(shù)據(jù)快速漫游。為了提高真實感，在數(shù)據(jù)上疊加了用同樣方式處理和調(diào)度的圖片紋理，利用四叉樹，分割算法實現(xiàn)了三維模型數(shù)據(jù)的實時動態(tài)顯示，在有效簡化石油化工組件三維模型數(shù)據(jù)基礎(chǔ)之上，保證石油化工模型渲染效果不會明顯減弱，生成的三維模型能夠達到20到30幀的速度，基本滿足石油化工模型實時瀏覽要求。

2.2 參數(shù)化解析技術(shù)研究分析

參數(shù)化解析技術(shù)采用基于組件的參數(shù)化方法為石油石化設(shè)計模型中各類部件數(shù)據(jù)建模方式，在加載、顯示石油化工模型部件時進行動態(tài)建模，對于石油化工模型參數(shù)數(shù)據(jù)，可快速生成預(yù)期石油化工模型，徹底解決了海量設(shè)計模型頂點存儲，數(shù)據(jù)量大，渲染效率慢的問題。實現(xiàn)了場景圖與渲染對象的分離，第三方開發(fā)者可以編寫場景管理器來實現(xiàn)石油化工設(shè)計場景圖以及部分組件模型調(diào)度而不必重寫渲染對象。異構(gòu)三維圖形庫統(tǒng)一渲染引擎對不同的底層石油化工組件圖形庫采用抽象工廠設(shè)計模式進行統(tǒng)一抽象，應(yīng)用層以統(tǒng)一的接口對底層圖形庫進行訪問，無需關(guān)心底層實現(xiàn)，當(dāng)?shù)讓訄D形庫的版本發(fā)生變化時只需修改或重新相關(guān)的具體實現(xiàn)即可，對上層應(yīng)用不會產(chǎn)生影響。

石油石化模型部件的三維實體均采用參數(shù)化建模方式實現(xiàn)，三維場景中，組件信息都是以三角面方式存儲的，這種方式存儲數(shù)據(jù)量巨大，而參數(shù)化存儲，是以用戶輸入的參數(shù)為起點，經(jīng)過程序內(nèi)部邏輯的分析處理，最終生成模型對象的過程。同時可運行多種瀏覽器，可同時拓展，與操作系統(tǒng)無關(guān)性的特點，基于WebGL的石油化工模型出了運行正在Windows平臺外，也可運行在Linux系統(tǒng)、及Android、IOS移動操作系統(tǒng)。

2.3 基于E3M技術(shù)的動態(tài)渲染技術(shù)研究分析

石油化工模型數(shù)據(jù)格式目前支持E3M格式，在模型渲染及優(yōu)化設(shè)計過程中，E3M格式它可減少石油化工模型中與渲染無關(guān)的冗余內(nèi)容，并且充分支持OpenGL，WebGL圖形加速標(biāo)準，具有利于網(wǎng)絡(luò)傳輸?shù)奶匦?，而廣泛適用于在互聯(lián)網(wǎng)和移動設(shè)備上展現(xiàn)三維模型。它采用頂點壓縮、紋理壓縮以及混合壓縮使數(shù)據(jù)體量更小。不可否認的是在由于大模型渲染批次較多我們在原來的基礎(chǔ)上支持b3dm內(nèi)部復(fù)用進而減少渲染批次提升渲染效率，并新增點選功能、屬性設(shè)置、獲取層級樹、部件定位功能。其中對于E3M模型瓦片格式更加適應(yīng)互聯(lián)網(wǎng)傳輸及Web運行環(huán)境，極大提高了石油化工模型的渲染及優(yōu)化效率。

2.4 基于幾何體實例化的渲染技術(shù)研究分析

針對石油石化模型固有特性，存在大量重復(fù)性部件，若每個部件都有實體，將占用大量存儲空間，因此有必要采用幾何實例化進行模型建模[7]。基于幾何實例的模型優(yōu)化技術(shù)是一種用于大批量重復(fù)模型部件渲染的GPU技術(shù)[8]，通過降低客戶端和顯卡傳輸數(shù)據(jù)量的方式來提高模型渲染和優(yōu)化的加載效率。

針對GPU渲染加速的特點，可實現(xiàn)同時渲染多個三維模型數(shù)據(jù)相同的部件時發(fā)揮作用，在石油石化煉化裝置設(shè)計中，有多個組件是重復(fù)構(gòu)造，只是在顏色、位置方向上存在稍許的差異，可通過模型數(shù)據(jù)在不同的空間位置、紋理及顏色上進行區(qū)分，從而創(chuàng)造出各個不同的煉化裝置實例部件，包括煉化、催化等裝置模型中閥門、管道、油罐相同的部件構(gòu)造等。它能夠?qū)崿F(xiàn)只需構(gòu)造出一個單體模型部件，就可以通過相同的渲染處理方式，實現(xiàn)多個模型部件結(jié)構(gòu)的復(fù)制使用。通過解析RVM，采用幾何體實例模型渲染復(fù)用方法，分批次對模型部件進行拼接，這樣建模出的石油化工設(shè)計三維模型體量小，從而提高石油化工模型的渲染效率。

2.5 煉化廠三維模型渲染優(yōu)化驗證分析

為保障基于WebGL的石油石化模型數(shù)據(jù)渲染技術(shù)效果可行性的驗證[9]，著重進行了石油化工煉化廠三維模型的設(shè)計并進行三維模型系統(tǒng)研發(fā)并進行了渲染優(yōu)化效果對比分析實驗。

3 模型試驗環(huán)境

煉化廠三維模型的加載渲染效果測試需要支持WebGL的瀏覽器GoogleChrome9+來運行石油化工模型應(yīng)用。由于石油化工模型的渲染效果測試對Web服務(wù)器的要求并不高，只要能響應(yīng)HTML頁面和其他文件的請求，有必要通過WebStorm開發(fā)三維圖形應(yīng)用對3D圖形庫進行模型加載渲染效果測試。因此，本實驗以谷歌瀏覽器作為三維圖形應(yīng)用和3D圖形庫運行環(huán)境[10]。

石油化工煉化廠三維模型渲染流程中各個環(huán)節(jié)表述如下：

(1)模型頂點處理 對頂點數(shù)據(jù)傳進來的每一個頂點，實現(xiàn)頂點的空間變化，將頂點數(shù)據(jù)組合成線段或三角形圖元。裁剪和剔除不在相機范圍內(nèi)的視錐體圖元，得到相機視錐體內(nèi)的圖元集合。這些信息可以通過對三個頂點進行插值得到的。煉化廠三維模型處理會針對圖元進行顏色計算、陰影計算和紋理映射等操作，并通過線性插值的方法得到像素點顏色值，從而輸出像素數(shù)據(jù)。煉化廠三維模型優(yōu)化在網(wǎng)頁端上渲染煉化廠三維模型，使用WebGL技術(shù)在網(wǎng)頁端上渲染大規(guī)模的石油化工模型[11]，對比在客戶端上使用OpenGL渲染大規(guī)模的三維模型限制更大[12]，需要針對模型數(shù)據(jù)和渲染方式進行對應(yīng)的優(yōu)化。在對煉化廠三維模型進行優(yōu)化時，著重從模型物體實例化進行繪制、模型非實時刷新渲染優(yōu)化、模型分類別渲染優(yōu)化、網(wǎng)格合并渲染優(yōu)化四個環(huán)節(jié)。

(2)模型物體實例化進行繪制 該繪制方式的接口為DrawArraysInstanced。其參數(shù)有渲染方式Mode、初始偏移量First、圖元的索引數(shù)量Count、實例化繪制圖元的數(shù)量InstanceCount。除了以上參數(shù)外，要使用實例化繪制網(wǎng)格傳入每個網(wǎng)格變換矩陣。

(3)模型非實時刷新渲染優(yōu)化 在當(dāng)前構(gòu)建石油化工模型WebGL煉化裝置過程中[13]，任何一個部件的裝置渲染處理，都會導(dǎo)致前端展示的效果，因為采用的均為實時刷新渲染方式，基于在靜態(tài)模型裝置的情況下查看其他部件時，避免了其他加載的模型數(shù)據(jù)共同刷新渲染，從而實現(xiàn)了所在視角范圍內(nèi)的石油模型數(shù)據(jù)非實時畫面的渲染刷新。

(4)模型分類別渲染優(yōu)化 在瀏覽石油化工模型的過程中，基于三維模型進行定位并移動到瀏覽人員關(guān)心的視角方向上。因此視角轉(zhuǎn)動時僅渲染石油化工部分組件模型，當(dāng)視角轉(zhuǎn)動停止時才渲染整體的石油化工模型。

(5)網(wǎng)格合并渲染優(yōu)化 在經(jīng)石油化工模型物體實例化繪制渲染、模型非實時刷新渲染和模型分類別渲染后，大規(guī)模石油化工模型實時渲染的網(wǎng)格對象數(shù)量依然很大，通過將材質(zhì)參數(shù)相同的網(wǎng)格對象合并渲染的方式，降低實時渲染時的網(wǎng)格對象的數(shù)量，達到減少渲染流水線調(diào)用次數(shù)，提升渲染效果。

建模工程師對煉化廠三維模型開展了渲染處理優(yōu)化實驗。得出加載效果有了較為明顯的提高。原始煉化廠區(qū)三維模型渲染線段數(shù)為3 142，每秒渲染幀數(shù)(FPS)為30，當(dāng)視點拉遠，優(yōu)化后渲染矢量線段數(shù)為1 218，F(xiàn)PS為60，渲染速度提升了將近一倍。具體局部場景視角轉(zhuǎn)動6 s的單幀渲染時間優(yōu)化效果如表1所示。

表1 煉化廠三維模型局部場景視角轉(zhuǎn)動6 s的單幀渲染時間

4 結(jié)語

文章針對現(xiàn)有石油化工模型的建模特性在渲染速度與渲染效果方面存在明顯不足的問題，對基于WebGL三維設(shè)計模型渲染技術(shù)以及優(yōu)化效果進行研究并進行建模實例驗證，利用LOD分層技術(shù)、參數(shù)化解析等先進的模型渲染優(yōu)化設(shè)計技術(shù)，構(gòu)建石油化工煉化廠三維模型，實現(xiàn)三維模型進行部件模型批量構(gòu)建以及動態(tài)化建模、模型數(shù)據(jù)計算對接，提升了石油化工模型渲染速度，為后期該領(lǐng)域的三維模型渲染優(yōu)化提供了技術(shù)指點，進一步提高了石油化工模型建模效率和水平。