一、 簡介
基於Web端的三維模型展示，這里僅介紹Three.js和Potree。
Three.js 是一款基於WebGL的運行在瀏覽器中的 3D 開源引擎，用它創建各種三維場景。它類似於Meshlab開源中的VCGLib庫，后者是基於OpenGL進行封裝的3D開源庫，本質是相同的。所以，基於three.js會比較靈活，模型顯示不失真。但對初學者來說，學習難度較大。另外，它沒有對模型網格存取與顯示做什么優化，在模型文件較大時，在瀏覽器打開時會等待較長時間。
Potree是一種基於WebGL的點雲數據可視化解決方案，包含點雲數據轉化，以及進行可視化的源碼。該解決方案的主要優勢在於對點雲數據進行了多尺度的管理，在數據傳輸和可視化上都做了優化。它是一套開源的系統，基於Three.js，由奧地利維也納理工大學的Harvest4D項目貢獻。
實際應用中，業務三維模型往往比較大(100M以上)，考慮到網絡帶寬等諸多原素，為了在Web端能快速的展示與操作三維模型。如果選擇Three.js，工作量會比較大；選擇Potree會相對比較省事，因為它已經在文件分離下載與快速渲染方面已行了很多優化。Potree的主要缺點是基於點雲格式顯示，存在部分失真情況。所以，下面主要將針對Potree進行重點說明，Three.js內容請大家參考下面網址。
二、 軟件環境
2.1 Potree
https://github.com/potree/potree
2.2 PotreeConverter
https://github.com/potree/PotreeConverter
2.3 Potree學習
https://github.com/potree/potree/blob/master/docs/getting_started.md
2.4 Three.js
https://github.com/mrdoob/three.js/
2.5 Three.js學習
三、 要點
3.1 轉換
Potree在Web上展示的點雲文件，支持binary，las和laz三種數據格式。所以，對其它的三維模型文件格式（例如：ply），需通過PotreeConverter工具進行轉換。
如圖一所示，經過命令行形式轉換后，會生成下面內容：
- 會生成多個.bin數據文件，每一個大小均在100K左右。這樣，Web加載時可以逐漸下載顯示，而不是全部下載完后才顯示。
- 整體資源打包，並生成一個靜態html展示主頁，方便瀏覽。
圖一
3.2 IO支持
Potree Converter支持格式：
- 輸入格式：las、laz、 binary、ply、xyz和ptx；
- 輸出格式：binary、las和laz。
3.3 速度
采用了特殊的點雲文件壓縮與分割處理，以及逐漸渲染方式，速度還是明顯很快的。經本人測試：Potree官網提供的多個demo顯示，最長時間為20秒顯示完畢，一般性的都是10秒內顯示完畢。假設如果是在國內網存取，理論上速度應該更快些。
3.4 瀏覽器支持
對目前主流的IE、Chrome和FireFox都支持，本人已在Chromev 57.0.2970.0和MicrosoftEdgeHTML 14.14393測試通過。
3.5 操作支持
支持鼠標左鍵旋轉、滾輪縮放、右鍵平移。另外，還提供強大的屬性操作界面，例如：角測量、高度測量、距離測量、面積測量、體積測量、多視角觀察等等。除了直接對模型進行編輯修改外，基本上其它功能都有。
3.6 中文支持
如圖二所示屬性操作界面，目前頁面是可以支持中文，但引用的i18next庫好象不支持中文，導致中文測試時顯示為亂碼。
圖二
四、 Web展示效果
經過在本地搭建web服務器后，進行測試(例如：http://localhost/potree/test.html)。下面是一些Potree在Web上顯示效果與Meshlab模型顯示的對比，實際上也相當於基於點的模型(點雲)文件和原始三維模型(例如：ply)進行比較。
備注：采用potree converter進行轉換時，如果調整某些參數，理論上生成的點雲文件應該會更清晰一些。
圖三
五、 基於Potree的解決方案
思路：在存放三維模型文件的服務器，存在一個后台運行的程序：定時讀取新的三維模型文件、調用PotreeConverter控制台程序自動轉換模型文件到Potree支持的目錄、關閉PotreeConverter控制台程序、將生成Potree目錄信息拼接成http網址(例如：http://localhost/potree/test.html，其中localhost將被真實的域名或IP取代)，最后更新到關聯數據庫中。此后台程序將包裝成Service API的形式（例如:RESTful方式）以供調用。當服務層每上傳一個模型文件成功后，調用該后台Service API接口來獲到生成的網址，將該網址隨原客戶端信息一起更新到數據庫中。這種由服務層直接拉的方式，可避免定時轉換問題、動態監測模型文件、以及遠程更新數據庫的問題。
例如：
PotreeConverter控制台轉換命令：
PotreeConverterD:\MeshLab_Model\20150602112021.ply –o C:\xampp\htdocs\potree –generate-page testCabinet
以下是我as格式的轉換命令
.\PotreeConverter.exe E:\OriginData\qinghai\las -o E:\OriginData\qinghai\las --generate-page web --output-format LAS --material INTENSITY
轉換后效果如下
拼接而成的網址:
http://localhost/potree/testCabinet.html (本地測試用)
圖四
六、 總結
經過一系列的測試、比較與分析，potree在速度方面已經基本達到要求。顯示質量方面略有不足，主要原因是它是基於點雲模型作為基礎來顯示，所以本身模型質量就比不上原始三維模型。不過，整體上看顯示效果還是差不多的，作為在瀏覽器上能快速觀看地目的，可以滿足此需求。