从“数字孪生城市”概念走红开始,全国各地“数字孪生城市”如雨后春笋般涌现,迅速推动了整个行业快速发展。与此同时,整个“数字孪生城市”产业链路上的技术瓶颈开始显现,尤其是数字孪生城市构建的核心环节之一的三维渲染引擎已经成为制约数字孪生城市项目正真实战落地的核心痛点。目前大多数数字孪生城市项目在三维渲染引擎的技术选型上通常是 2 种方案,一种是主流游戏引擎,另外一种是传统 GIS 引擎。
数字孪生城市定义
CIM = BIM + GIS + IoT
建筑信息模型 BIM 代表了建筑体的精准表达。
地理信息系统 GIS 数据(包括矢量数据、倾斜摄影、高精地图、卫星影像等等)提供了建筑体之外整个城市的数据表达。
IOT 设备好比是整个城市的神经网络,为整个数据孪生城市的全域感知提供了信息来源。
需要什么样的渲染引擎
数字孪生城市的构建,必须基于精准的地理数据
数字孪生城市的呈现,必须尽量还原真实世界
常见的引擎技术方案
从当前主流的数字孪生产品看,主要还是 GIS 引擎和游戏引擎为主,目前市场上场景的有 mapbox、cesium、UE4、Unity、Ventuz 等几类。
mapbox:极受欢迎的 2.5D GIS 引擎,地图样式功能尤其强大,GPU 渲染的方案在渲染速度上远远甩开了 leaflet 等老牌对手,在 mapbox 衍生出了很多数字城市应用;缺点是对三维渲染的效果和自由度不是很高。
cesium:二三维一体化的 web GIS 引擎,GIS 数据支持能力异常强大,很多大厂商如超图等也是采用 cesium 方案;缺点是三维视觉效果较差,应用开发比较复杂。
UE4:目前是业内比较公认的 No.1 商用游戏引擎,视觉效果非常出色;缺点是对 GIS 支持不佳,而且开发成本非常高。
Unity:与 UE4 相比能输出 web 适配的应用;缺点是对 GIS 支持不佳,而且开发成本比较高。
开源前端库:比如用 deck.gl、threejs 等前端库作为渲染方案的,此类引擎通常以开源类库提供,距离产品级方案还有太大的开发成本。
![[]](https://www.zhangqin.tech/2023/03/11/%E5%89%8D%E7%AB%AF/%E6%95%B0%E5%AD%97%E5%AD%AA%E7%94%9F%E5%9F%8E%E5%B8%82%E4%B8%89%E7%BB%B4%E6%B8%B2%E6%9F%93%E5%BC%95%E6%93%8E/%E8%B1%A1%E9%99%90%E5%9B%BE.jpg)
DataV.CityPro
我们从阿里云的 DataV.CityPro 产品介绍来看,打造一款数字孪生引擎多么艰难。
在阿里集团城市大脑、数字政务、智慧交通等大量数字孪生项目的孵化下,DataV 团队自主研发了数字孪生渲染引擎 DataV.CityPro 。DataV.CityPro 引擎在架构设计上基于主流 GIS 引擎采用的二三维一体化地理空间,对时空数据实现了底层支持;在图形渲染技术上,采用自研的渲染管线、材质系统、后期系统,实现了主流游戏引擎的渲染效果。
这里我摘录了部分 DataV.CityPro 的优势:
精准地理数据源支持
DataV.CityPro 全面支持 CIM 数据需求,实现数字孪生世界的精准重建,尤其是对目前数字孪生城市迫切需求的 BIM、倾斜摄影、高精地图这精准重建三要素提供了良好的支持,包括提供进一步的数据融合与交互支持。
简单易用的编辑器
易用性一直是三维渲染引擎的重大挑战之一;面向数字孪生城市渲染的产品,同时兼具三维产品/GIS 产品的特点,需要用户对三维图形、地理数据有相当程度的认知,这也导致了三维渲染引擎的功能复杂、操作困难。
提升产品易用性的核心切入点是编辑器的研发,在 DataV 积累多年的编辑器框架基础上,全新推出了适用于数字孪生场景搭建的数据编辑器、场景编辑器、关键帧编辑器,在数字孪生场景搭建与交互串联的功能上实现了可视化编辑,设计师可以用“所见即所得”的模式进行数字孪生城市场景搭建。
渲染能力
DataV.CityPro 通过自研 PBR 渲染管线,除了对三维模型的精准还原之外,还支持物理真实的地球大气层模块、大范围实时阴影、AO 等后期效果系统。由于数字孪生城市场景大量城市模型是算法生成,为了提升视效,DataV.CityPro 引擎实现了全新的各类地理要素 PBR 材质生成算法,对地形、水系、道路、建筑等提供数十种不同渲染精度的程序化生成材质。
从哪开始入门
从上面可以看出在不借助第三方一体化的产品情况下,去构建自己的数字孪生产品需要投入多大的资源!在没有专业的测绘与建模等等技术团队下,我决定从门槛最低的 WebGL + ThreeJS 开始学习,先努力实现下图那个粗糙的效果!
WebGL 是一种 3D 绘图协议,衍生于 OpenGL ES2.0,可以结合 Html5 和 JavaScript 在网页上绘制和渲染二/三维图形。
Three.js 是基于原生 WebGL 封装运行的三维引擎,在所有 WebGL 引擎中,Three.js 是国内文资料最多、使用最广泛的三维引擎。
![[]](https://www.zhangqin.tech/2023/03/11/%E5%89%8D%E7%AB%AF/%E6%95%B0%E5%AD%97%E5%AD%AA%E7%94%9F%E5%9F%8E%E5%B8%82%E4%B8%89%E7%BB%B4%E6%B8%B2%E6%9F%93%E5%BC%95%E6%93%8E/%E6%95%88%E6%9E%9C%E5%9B%BE.jpg)