作為數字空間綜合解決方案引領者，如視一直致力于通過軟硬一體的解決方案，為用戶提供高精度、高效率、高穩定性的服務。想要將這些服務真正做到落到實處，離不開如視在生產、處理、應用各環節中的層層把關和精細打磨。

本期聚焦產品欄目，我們將深入如視產品背后的工程技術領域，聚焦應用層，深度解析如視為保證整體服務穩定性和優質性，如何通過瓦片加載、模型多細分層級以及圖像HDR處理等方法，讓用戶體驗到更快速、清晰、流暢、細節好的數字空間。

全景圖：瓦片化漸進加載

在數字空間中，高質量全景圖需要占用較大的存儲/傳輸空間，為保證空間瀏覽穩定性，如視采取瓦片化加載方式呈現全景圖，無論用戶使用何種終端設備，在當下點擊和瀏覽數字空間時都能夠獲得匹配設備分辨率的內容展示體驗，清晰、快速、流暢；且通過未瀏覽區域暫緩加載的方式來釋放整體的存儲壓力。如視通過這種方式，改善設備的加載性能，提升了用戶交互體驗。

在VR中縮放/點擊任何位置，都會顯示匹配當下設備分辨率的高清內容

瀏覽全景圖時，如視要解決什么問題

為了讓用戶擁有更真實的數字空間體驗，如視不斷提升自身硬件采集能力。以專業級掃描設備伽羅華為例，其360°環繞拍攝后，可自動生成分辨率高達16K——即16384?×?8192（1.34億像素）的彩色全景圖像。

圖像分辨率越高，占用的存儲/傳輸空間越大。單張16K分辨率的全景圖像大小約為40MB，以一套100平方米的房子為例，假設拍了25個點位（即25張全景圖），那么，該數字空間中全景圖所占用的存儲/傳輸空間就需要1個G。

要將如此像素量級的高畫質圖像通過網絡“原封不動”的呈現給用戶，對網絡環境和終端設備來說，都是一個不小的挑戰。因此，若想為每位用戶提供極致的數字空間瀏覽體驗，如視需要解決以下幾個問題：

設備運行要流暢

如視生成的全景圖像，需要能夠在多數用戶常用的終端設備，如智能手機、平板電腦、PC臺式機中流暢運行，不卡頓。

圖像細節夠清晰

很多用戶會發現，手機相冊里清晰顯示的照片，上傳至某些社交平臺后細節卻變模糊了，這是因為平臺為了流暢度等對照片進行了壓縮處理。在數字空間中，圖像壓縮則意味著空間細節缺失，因此，如視希望能夠將采集到的高清圖像1:1展示給用戶，不損失任何細節。

加載效率足夠高

從點擊進入空間到步進式游走各環節，如視都需要能夠讓用戶快速瀏覽和交互，得到絲滑、流暢的空間漫游體驗。

顯然，在有限的網速和差異化終端設備條件下，將所有高像素全景圖片全部加載展示并不是一個好方案。那么，如視是怎樣解決這個問題的呢？

如視是如何做的

首先，如視通過對用戶查看全景圖這個場景進行分析，得到了以下幾個條件：

當用戶查看全景圖時，無論圖片存在多少像素，用戶終端設備的顯示分辨率是固定的。比如設備顯示分辨率為1920×?1080，那么無論圖片分辨率是3840×2160還是7680x4320，其最終顯示的實際像素都是1920×?1080。

當用戶縮放圖片時，看到的圖像內容占全景圖比例擴大，而一旦用戶終端設備的顯示像素密度，不能夠承載圖像像素密度（像素點無法一一對應），多余的像素會被浪費，甚至出現摩爾紋等負面效果。

摩爾紋：細密線條或點陣疊加時產生的干擾圖案

當用戶放大圖片時，看到的圖像內容占全景圖比例縮小，用戶終端設備的顯示像素密度將逼近甚至超過承載圖像像素密度，此時就需要更大尺寸的圖像，否則顯示效果不夠清晰銳利，影響用戶體驗。

基于以上條件，如視采取瓦片化漸進加載全景圖，來達成設備運行流暢、圖像細節清晰的效果。

什么是瓦片加載？

傳統瓦片加載是指在地圖服務中，通過預先在服務端將地圖瓦片分層（采用金字塔模型）并全量渲染，再根據地圖不同的顯示級別將瓦片切分為相應圖片，用戶每次訪問時，這些圖片會按照順序逐步呈現。

如視前端團隊借鑒了這種思路，使用瓦片加載的方式加載全景圖。如視將全景圖細分成多個遞進的分辨率層級和分塊，通過quad-tree（4叉樹）管理。在用戶不同的終端設備、縮放比例下，加載屏幕區域內適合層級的分塊，最終將加載/顯示的總像素數近似于用戶終端設備的顯示像素數。

如視將全景圖分為多個遞進分辨率層級

瓦片漸進式加載能帶來什么？

提升用戶體驗

這種按需加載方式可以保證局部畫面的清晰效果，同時解決了加載速度問題。在加載時，先加載低分辨率層級分塊，后逐漸補足當前屏幕需要的分辨率分塊，使用戶能夠更快、更清晰的看到圖像內容，減少等待時間，極大提升用戶體驗。

改善設備加載性能

在顯示策略上，瓦片僅在用戶視野范圍內加載并展示，并根據屏幕的像素數與視場角度（FOV）計算角分辨率（DPR）來控制顯示的瓦片層級。因此，在達成最佳顯示效果前提下無需下載過多的資源文件，能夠改善設備的加載性能。

適應不同網絡環境

瓦片漸進式加載可以根據不同網絡環境，動態調整圖像加載速度和質量。在網速較慢時，優先加載低質量圖像，為用戶提供基礎視覺內容；在網速較快時，可以加載高質量圖像，提供更清晰的視覺體驗。

3D模型：模型的多細分層級（LOD）

如視的實景三維重建，離不開精細的3D模型。同全景圖類似，用戶在數字空間中實現對模型的旋轉、放大、縮小等任意操作，也離不開設備流暢、圖像清晰、加載效率高、占用資源少等必要條件。如視通過對3D模型的多細分層次（LOD）加載，利用自研3d-tiles 加載器，讓模型加載更快速、流暢。

如視的3D模型，可對其流暢操作

什么是LOD加載

LOD（Level Of Detail）即多細分層級，是一種多層次細節展示的技術，它根據物體與相機的距離來確定顯示哪個模型，減少計算負擔。

比如，我們利用LOD來展示一棟樓盤的3D模型，當物體離相機近時，顯示高精度的模型，讓小區設施清晰可見；當物體離相機遠時，顯示低精度的模型，僅展示樓盤的大致構造。

如視采用了這種思路進行三維模型加載，與上述提到的瓦片加載類似，當用戶需要查看局部細節時，可以加載更清晰的模型，同時提高加載效率。

什么是3d-tiles

3d-tiles（三維瓦片）是一種用于高效傳輸和渲染大規模 3D 地理空間數據的開放標準，由Cesium（一個開源的 JavaScript 庫，用于創建 3D 地球和地圖的可視化）開發，支持各種3D數據集，如城市模型、點云等。其主要特點就是采用了LOD加載，根據視圖距離調整渲染細節，提高了渲染效率，使得在 Web 上展示復雜的 3D 場景成為可能。

如視自研的3d-tiles 加載器

如果將3d-tiles比作商場櫥窗，那么3d-tiles 加載器就是將商品放進櫥窗展臺的角色，而這些商品就是數據集，用戶透過櫥窗看到的整體效果就是3D可視化。

Cesium.js是最常用的庫之一，但不同于 Cesium.js，如視的采集內容包含室內場景、自然景觀等等，并不限定于 GIS 這種地理信息內容，所以顯示內容并不局限于地球/太陽光照等維度。

基于此，如視自主研發了基于 threejs 的 3d-tiles 加載器，相比 Loader.gl 等開源庫實現更全的 3d-tiles 的格式兼容支持。比如：

?              skipLevelOfDetail 加載圖塊跨級渲染

?              Glb / b3dm / pnts 等及以外的模型格式作為模型物料

?              Glb 內置支持對 ktx2, draco, meshpot 等優化特征的支持

以及通過 WebAssembly 技術優化密集任務的計算效率、 使用 Web Worker 處理并行計算任務等額外優化手段，使模型加載更快速、流暢。

圖像的 HDR 處理

為什么要進行圖像HDR處理

如視在采集全景圖時，需要將亮度控制在一定范圍內，確保圖像中較亮的顏色比如燈光、墻壁等不過曝；較暗的部分如墻角等不漆黑一片。但由于全景圖覆蓋的場景范圍過大，如工業園區等，在空間亮度差異較大的情況下往往會顯得圖像動態范圍（明暗差別）不足，這就使全景圖像丟失大量細節，令生成的數字空間不夠真實，用戶觀感差。因此，如視需要對圖像進行HDR處理。

分別為圖像過暗、過曝、HDR顯示

如視如何做HDR處理

HDR（High Dynamic Range Imaging），又被稱為高動態范圍成像，用于捕捉和顯示場景中最亮和最暗部分的更多細節。其特點是通過將不同曝光的多張照片合成為一張圖像，來同時呈現亮部和暗部細節。

HDR圖像同 jpg / png等格式圖像相比，細節展現更為豐富，但同時也占據更多存儲空間。如果直接使用.hdr格式來記錄更高動態范圍的數據，因為傳輸體積增大，無法采取瓦片化漸進加載方式，會讓上文中對全景圖的優化失效。同時，由于HDR終端設備顯示效果參差不齊，難以讓每位用戶都有極致的數字空間漫游體驗。

如視通過運用屏幕空間HDR方案來解決這個問題。

首先，如視利用 Luminance 圖像來記錄對應像素的亮度權重。Luminance 圖像是一種灰度圖像，僅包含亮度信息，不包括顏色細節。它表示圖像中每個像素的光強度。

獲取亮度權重后，如視就可以通過亮度權重來計算圖像的Gamma校正（伽瑪校正：一種調整圖像亮度的技術，用于匹配顯示設備的非線性特性），來動態改變畫面亮度，確保圖像在不同設備上顯示一致。

最后，通過設置一些延遲過度參數，來模擬人眼瞳孔收縮帶來的光暈變化，得到近乎真實世界的瀏覽體驗。

如視HDR方案優勢

如視的屏幕空間HDR方案，基于全景圖瓦片化漸進加載，不僅運行速度快、加載效率高，還極大提升了全景圖像的動態范圍，能夠準確還原數字空間內部的明暗變化、顏色細節。

我們以一處室內空間為例，未應用屏幕空間HDR前，室內陽光暗淡無變化，陰影處較為灰暗：

應用屏幕空間HDR后，可以明顯感受到門前的陽光明暗變化，暗處細節也更為清晰。

“真實”藏在細節里，無論是針對二維全景圖的瓦片漸進加載優化、3D模型的多細分層級調整，還是圖像細節的HDR處理，如視的最終目標都是為用戶提供更高效、穩定的服務，讓用戶擁有更優質的數字空間漫游體驗。

未來，如視會繼續打磨工程技術細節，讓生產、處理和應用的每一個環節都更加優質和高效。

關鍵詞：