WEB 三維引擎在高精地圖數據生產的探索和實踐

1. 前言

高精地圖（High Definition Map）做爲自動駕駛安全性不可或缺的一部分，能有效強化自動駕駛的感知能力和決策能力，提高自動駕駛的等級。對於自動駕駛來講，高精地圖主要是給機器用的，可是在製做和分析過程當中依然須要人可以理解。本文將爲你們簡單介紹下，在過去的一段時間裏高德高精地圖業務團隊，在WEB三維引擎技術方面的一些探索和實踐，如何讓複雜抽象的地理數據呈如今人們面前，知足其業務編輯和分析的訴求。

高精地圖主要是對道路交通層對象（如：車道地面標線、交通燈、交通牌、防禦欄、杆等）的精細化表達，包含其幾何位置和屬性。因爲對精度要求極高，它的製做主要仍是依賴激光點雲，一般都是海量的數據，一個路口的點雲量就可能上億，這就對渲染引擎的性能有較高要求，要知足對海量點雲實時渲染和拾取編輯。

起初，咱們調研了市面上主流的Web三維地圖引擎：Mapbox、Cesium、JS API、L7等，它們廣泛對點雲的加載處理能力支持不夠，偏向於對抽象的點、線、面表達，精細化渲染能力不足，同時也知足不了做爲編輯工具對複雜Topo關聯關係的編輯能力。對於高德高精數據編輯分析的業務場景，須要更多的底層抽象能力建設。因而，咱們在高精業務中開啓了三維引擎eagle.gl的探索實踐之路。

先經過一個視頻簡單瞭解下目前高德三維引擎eagle.gl的能力，它實現了一套2/3D統一的地圖數據編輯和可視化解決方案，具有很好的可擴展能力，目前已應用在高德高精地圖數據生產、數據分析、以及新基建項目等業務。

2. 引擎方案設計實現

基於上面的分析，咱們須要實現一套知足高德業務場景需求的數據製做引擎能力。爲了避免重複造輪子，最大程度利用已有的開源能力，咱們最終選用Threejs看成渲染層框架依賴。基於該框架，在上層構建GIS可視化和複雜編輯能力，最終實現構建一套2/3D一體化渲染引擎。同時面向將來智慧城市、5G IOT方向，構建數據團隊面向業界看齊的GIS 3D可視化能力。

Figure 2.1 面向高精地圖的2/3D一體化數字引擎

整個引擎工做能夠拆分爲三個部分（點雲地圖、矢量地圖、模型地圖），前端團隊總體工做須要圍繞這三個點去展開。

• 點雲地圖：對接多種點雲資料格式的可視化(las/laz/bc/xbc/rds/bin)，支持海量點雲的實時渲染和編輯，知足主產線對點雲資料的做業吸附能力。
• 矢量地圖：主要對接在線生產產線矢量化成圖能力，經過數據快照、命令行編輯模式、空間數據索引等能力實現矢量化3D數據的增刪改查能力。
• 模型地圖：主要面向數據成果應用層，進行數據預處理建模、實時建模編輯等，實現數據能力與高德客戶端車道級渲染能力拉齊。

3. 技術解題

下面簡單介紹一下各個核心模塊能力。

3.1 全幅面精細化渲染

高精數據有着更精確更豐富的信息，支持更精細的數據渲染，更好地還原真實世界。

Figure3.1.1 全幅面精細化渲染

高精原始的產出數據是矢量化骨架數據，這一層數據是真實世界的數字化的點線面抽象，怎麼根據原始的矢量數據進行模型化渲染展現呢？原始矢量數據是面向自動駕駛等機器使用，爲了可以更好的核實數據質量，進行數據問題調查分析，咱們須要把點線面矢量數據進行建模渲染，達到最終模型化精細化渲染效果，方便人工進行快速的問題覈實。

Figure3.1.2 原始的矢量化數據成果

Figure3.1.3 端上實時數據建模精細化渲染成果

爲了支持精細化的渲染效果，eagle.gl引擎目前支持經常使用的點、線、面、體、文本、模型等多種可視化圖層，而且經過配置化的方式實現了數據渲染實現。

整個建模渲染分爲如下核心模塊流程, 主體流程是原始點線面矢量數據拉取，根據規則進行數據解析，數據建模處理，數據合併和Instance處理，數據渲染。其中工做量最大的部分在於數據預建模處理，由於原始數據的表達更加抽象，爲了更加真實的還原世界，須要作不少的邏輯計算，例如斑馬線/導流帶數據表述中只有外邊的邊框輪廓，爲了渲染的更真實，須要根據數據的長短邊規格和交通路網規範，進行過程當中實時建模生成。

Figure3.1.4 端上渲染建模核心流程

Figure.3.1.5 斑馬線原始幾何

Figure.3.1.6 斑馬線建模後幾何

經過一樣的處理方式，咱們就可以實現數百種高精數據定製化建模能力。可是好幾百種數據規格若是經過硬編碼的形式進行建模會致使整個代碼結構的腐化和不可維護。所以咱們在引擎層實現數據配置驅動地圖圖面樣式展示的能力。

Figure.3.1.7 多種高精數據建模成果表達

對於style的定義咱們區分爲兩種類型，一種是基本的feature要素對應的展示行爲，這層style目前定義爲靜態的style配置；另一種style是tile數據源驅動的styleSchema，這種style會定義動態的屬性以及空間場景、燈光等共有屬性定義。

基礎要素層對應的style咱們主要分爲如下幾個類型：

IBaseStyle | ILineStyle | ITextStyle | IPointStyl | IPolygonStyle | IModelStyle | ICustomStyle

舉個例子，咱們用模型樣式類ModelStyle，新增模型的樣式定義，繼承自IBaseStyle。

mapView.addDataLayer({
  id: 'model', // 圖層id，id爲惟一標識，不能重複
  style: {
    type: 'model',
    resources: {
      type: 'gltf',
      base:
        '//cn-zhangjiakou-d.oss.aliyun-inc.com/fe-zone-daily/eagle.gl/examples/assets/theme/default/model/',
      files: ['ludeng_0.glb'],
    },
    translate: [0, 0, 0],
  },
  features: [
    {
      geometry: {
        type: 'Point',
        coordinates: [[116.46809296274459, 39.991664844795196, 0]],
      },
    },
  ],
});

屬性

置爲灰色部分表示繼承自BaseStyle屬性

ModelResource資源定義

經過上面的API調用就能夠實現模型數據的加載渲染。整個地圖圖面的全量要素表達均可以經過這種形式進行可視化描述。

Figure.3.1.8 gltf模型如何通知配置樣式進行定義加載

3.2 多源異構數據一體化渲染

對於HD的數據生產，點雲和DEM高程分爲對應採集和應用側最核心的資料數據表達。做爲引擎的特點能力，目前引擎實現了DEM高程渲染和多維度的點雲着色能力，後續還會進行BIM/傾斜攝影等多源模型能力的接入，實現基於一張圖進行宏觀/微觀一體化展現能力。

3.2.1 DEM高程渲染

Figure.3.2.1.1 DEM渲染效果DEMO

高精的數據是XYZ的三維數據表達，可是咱們不少傳統的路網數據都是二維的，如何實現多源矢量數據的混合疊加，咱們採用接入DEM高程方案，把無高程的傳統背景數據/路網數據拔投影到海拔高度。原始輸入的爲tiff圖像文件，經過利用數據預處理進行QMesh渲染矢量生成，主體數據處理流程以下：

Figure.3.2.1.2 DEM數據渲染處理流程

QMesh渲染方案是Cesium推薦的如今及將來使用的地形切片格式，與Heightmap格式相比較，具備更高的性能優點和更小的數據存儲。基於性能更優的QMesh幾何處理方案，實現全國山體地形實時加載，同時支持在worker中進行地形實時細分，能夠基於低級別三角面動態計算渲染至21級地形。

Figure.3.2.1.3 多源異構數據融合一體化渲染 - DEM高程方案

3.2.2 點雲地圖

點雲做爲高精特點的採集資料，與傳統的照片資料相比，可以最大精度的還原真實世界的三維位置信息。爲了實現真實世界的高度精細化描述，Web海量點雲加載和渲染在咱們平常工做中是很是重要的內容。

點雲渲染的最大問題是海量數據實時加載和動態拾取，eagle.gl實現了基於全球ECEF統一座標索引下點雲實時從網絡加載，可以實現支持內存中同時800w以上海量點雲LOD實時加載以及根據反射率/高度/MIX混合着色能力，渲染幀率能夠保持在60fps，經過GpuPicker和Raycast混合拾取方案實現數據拾取交互的實時性。

Figure.3.2.2.1 基於LOD點雲的實時吸附編輯能力

3.3 交互和擴展能力

對於地圖數據生產，數據可視化展現是第一步，如何在數據可視化展現的基礎上進行上層複雜的GIS編輯能力建設是業務增值的重要一環。

3.3.1 交互能力

爲了知足高精產線複雜的數據編輯訴求，拾取是編輯最底層的能力, 融合射線拾取與GPU拾取，能精準知足對海量數據20ms之內的快速拾取能力。

Figure.3.3.1.1 海量數據拾取能力

數據裁剪能力：立交場景下，數據間的互相遮擋會對數據分析產生必定的影響，咱們默認提供了數據裁剪能力以知足複雜場景的數據編輯&分析需求。

Figure.3.3.1.2 數據實時裁剪

3.3.2 插件體系

引擎支持插件開發，用戶能夠根據本身的需求定製插件，目前咱們提供了測距、編輯和框選三個插件供你們參考。同時，引擎還支持圖層和控制器的定製化開發，知足多樣的業務場景。

Figure.3.3.2.1 測距插件體系

3.4 其餘能力 - 視覺&動效

3.4.1 飛行

平滑的飛行效果和基於濾鏡的背景換膚能力。

Figure.3.4.1.1 平滑的飛行效果/背景換膚

3.4.2 光影

模擬一天中的時間，實現光照陰影能力。

Figure.3.4.2.1 光照陰影

3.4.3 後處理

深度定製擴展threejs，實現擴展的後處理渲染管線，而且抽象出通用三方後處理基礎庫，該庫增長了引擎的後處理能力，用於提高可視化效果，爲將來大屏項目作準備。

Figure.3.4.3.1 後處理

3.4.4 3D地球

23D一體化，支持墨卡託投影和球投影的自由切換，加強可視化效果。

Figure.3.4.4.1 2/3D一體化球展現

4. 總結規劃

目前，eagle.gl引擎普遍應用到了高德高精團隊的數據生產、數據分析和新基建項目能力建設當中。後續隨着引擎的能力完備，一方面立足於高精業務實現面向自動駕駛的仿真平臺搭建；另外一方面經過真實世界數字化的刻畫，實現多源異構數據（DEM/BIM/傾斜攝影等行業相關）融合渲染，最終達到數字孿生能力。

以上的事情要最終實現任重道遠，歡迎聯繫加入咱們共同構建一個數字世界。歡迎對通用平臺前端、在線編輯IDE、3D可視化方向感興趣的小夥伴加入咱們，一塊兒作一些有意義的事情。投遞簡歷到 gdtech@alibaba-inc,com, 郵件主題爲: 姓名-技術方向-來自高德技術, 歡迎自薦或推薦。