基于全景图像的灾情展示系统设计与实现

赵 杰，张 洋，宁亚灵

（1.山西省地震局，山西 太原 030021；2.天津市滨海新区城市建设档案馆，天津 300450）

自然灾害发生后，无论是应对灾害的指挥部领导还是公众，最想了解的都是灾情信息。灾情获取来源广泛，灾区现场群众、灾害应对主管部门、新闻媒体均可提供丰富的灾情信息。灾害发生后，及时地将灾区的灾情展示出来，对于辅助指挥部领导决策、增强信息传播透明度、保障群众合理知情权、阻止谣言传播都具有不可替代的作用[1]。目前灾情信息的载体一般包括文档、图片、影音资料、航拍影像等。全景技术是VR技术的一种实现方法，将多张相关的图片通过同名点拼接成全景图片，以在视觉上垂直180°、水平360°的全覆盖来展示现实空间信息，具有一定的交互性和真实的沉浸感，是一种流行的视觉新技术[2]。通过全景技术来展示灾情具有普通图片、视频等信息展示技术不具备的优势，结合VR眼镜，可让用户具有真实感，可全方位无盲区显示灾情信息[3]。全景图是一种基于全景技术与电子地图发布技术的可定位展示真实场景的VR技术[4]。将全景图与Web GIS相结合，Web GIS能为用户提供空间导引，全景图能为领导、群众提供沉浸式、全方位、交互式的灾情展示服务。

本文设计了一套基于全景图像的灾情展示系统，采用B/S架构，鉴于自然灾害发生后时间紧任务多的特点，采用简单的全景图像拍摄技术，以公共地图为Web GIS开发平台，采用开源的全景图像展示方案。

1 系统设计和关键技术

基于全景图像的灾情展示系统主要包括全景图像拍摄上传、基于公共地图的全景图像展示、全景图像展示灾情信息3个模块。系统实现采用的技术方法如表1所示。

表1 系统实现的技术方法

1.1 全景图像拍摄上传

全景图像的制作一般包括照片拍摄、预处理、图像匹配和拼接等步骤。照片拍摄可采用专业的全景相机，其自身集成了多个超广角摄像头，并配备了配套的图像处理软件，将照片导入专用软件即可导出为一张全景图片。该方式虽然比较简单快捷，但需要采购专用设备，资金投入较大，通用性不强。照片拍摄还可采用普通的手机，首先原地拍摄若干张照片，且保证照片有70%以上的重叠率，然后导入Photosynth等全景图像合成软件中进行处理。该方法无需购买专用设备，但其后续步骤繁琐，且对拍照的姿态要求较高，合成的图片效果不太理想[5]。

本文设计的系统采用集成在Android 4.2 Jelly Bean及以上版本的谷歌原生“相机”App进行全景图像的拍摄，“Photo Sphere”拍照模式可引导用户一次性对周围场景进行全景拍摄，再自动合成为全景图像。“Photo Sphere”拍照模式通过手机陀螺仪确定相片姿态，用户只需按照其引导即可拍摄出高质量的全景图片，使用十分便捷，且无需导入其他软件进行全景图像合成，节省了大量时间，同时也满足了在灾区拍照时不方便携带太多设备的要求。谷歌原生“相机”App在搭载安卓系统的手机上皆可免费安装使用，也有适用于iOS系统的版本，可满足灾区工作人员零成本、快速获取全景图像的需求。系统的全景图像采用等距柱状投影（ERP），该投影将球面上的经线和纬线映射为间距相等的垂直线和水平线，利用相同数量的采样点保存每条纬线上的数据[6]，覆盖范围为360°×180°，长宽比例为2∶1；以观察者（即相机摄像头）为球心，将拍摄的照片投影至球面。这种投影还原至全景图像时与人眼模型最为接近，可在视点处提供全方位连续的视觉描述。用户将全景图像上传至云服务器，云服务器采用腾讯云平台，以SQL Server为RMBS。存储全景图像的数据库设计如表2所示。

表2 数据库结构

1.2 基于公共地图的全景图像展示

公共地图是全景图像的载体，显示了自然灾害和灾区全景图像的地理位置。系统采用腾讯地图API作为GIS开发基础平台。相较于其他公共地图或GIS平台，腾讯地图API的特点是地理定位准确、本身具有全国最全面的街景数据[7]。按照系统设计，用户在利用移动设备拍摄完全景图像后即可上传至云服务器，这时再利用公共地图提供的地理定位API获得自身位置，无需其他设备，腾讯地图地理定位API可提供较高精度的定位服务。此外，通过手机浏览器定位获得的经纬度，在腾讯地图上显示最为准确，在其他地图平台上的偏差较大。

系统开发平台采用腾讯地图Javascript API V2，可在网站中加入交互性较强的街景、地图，能很好地支持PC和手机设备，身材小巧、动画效果顺滑流畅、动感十足，能提供地图操作、标注、地点搜索、出行规划、地址解析、街景等接口，功能丰富，并免费开放各种附加工具库。此外，Javascript API V2为免费服务，任何提供免费访问的网站均可调用。

1.3 全景图像展示灾情信息

全景图像展示是通过浏览器实现的，主要包括PC端和移动端上的浏览器。常用的全景图像显示技术包括Adobe Flash Player、Java Apple、QTVR、HTML5等，前3种技术均需在客户端安装插件、使用不便，很多产品需要付费、技术落后；而HTML5在三维图形的表现上引入了WebGL、SVG、Canvas、CSS3等技术，具有浏览器原生支持、性能高、标准规范的特点。系统采用Photo Sphere Viewer 作为全景图像的解析展示技术。Photo Sphere Viewer基于 Three.js，在支持WebGL的浏览器上具有十分流畅的表现，在仅支持HTML Canvas的浏览器上同样表现尚可；是开源的Javascript库，支持VR设备。

2 系统功能模块

系统适用于各类自然灾害的灾情展示，以地震为例，地震发生后（本文中地震仅为测试，非真实地震）工作人员赶赴灾区或震区群众打开手机“相机”App，按照系统引导拍摄“Photo Sphere”格式的全景图像，再通过浏览器将全景图像上传至云服务器，指挥部、群众或媒体则可进入全景图像地图导览页面，查看感兴趣地点的灾区全景图像。系统各功能模块如图1所示。

图1 系统功能模块

2.1 全景图像获取与处理

地震发生后，主管部门随即派出地震现场工作队，同时震区群众也向有关部门报告灾情。通过手机的“相机”App拍照十分简单便捷，由于手机具有陀螺仪设备，App可识别手机姿态，引导用户拍摄全景图像，无需其他专业设备，如图2所示。只需将相机移动对准每个提示点，即可轻松拍摄全景照片，拍摄结束后，App可自动合成为标准的全景图像，大约需要15～20 s。通过简单的三脚架可以让手机获得更加稳定的图像，但拍摄全景图像的天空和地面不太方便。

拍摄全景图像时，拍摄地面一般会把拍摄人员的脚也拍进去，可通过手机端的图片处理软件简单修复，一般手机原生的图片处理功能即可实现；即使不修复地面部分，也可在全构建还原全景图像场景时，通过控制看向地面的视角进行规避。

2.2 全景图像上传发布

用户将全景图像上传至云服务器，同步填写全景图像反映的灾情场景的详细描述、主要灾害类型、拍摄人员、联系方式等。全景图像的经纬度通过浏览器调用腾讯地图地理定位API进行自动定位，若不是拍摄完毕后当即上传，也可记录下来后续自行填写。全景图像上传界面如图3所示。

2.3 全景图像地图导览

调用腾讯地图API，在地图上显示所有用户已上传的全景图像，并显示灾害位置，可切换地图类型（普通地图和卫星影像地图）。该功能面向指挥部、公众、媒体开放，可显示全部全景图像的空间位置，点击图标即可查看全景图像。全景图像地图导览界面如图4所示。

2.4 灾区全景图像展示

用户可在PC端、移动端通过浏览器全方位、交互式地查看灾区的全景图像；可设置情景自动浏览，投放至指挥部大屏幕上供领导专家查看；可手动旋转缩放360°无死角查看灾情；可打开VR模式，戴上VR眼镜进行沉浸式体验，真实体会灾区的灾情；可设置标记，对全景图像情景内需要特别关注的点进行标注，或链接至其他全景场景，无缝切换。小至市内建筑物破坏，大至滑坡、泥石流等大范围地质灾害，系统都可以较好地显示灾情情况。灾区全景图像展示界面如图5所示。

图2 拍摄全景图片导引

图3 全景图像上传

图4 全景图像地图导览

图5 灾区全景图像展示

3 结 语

本文设计的基于全景图像的灾情展示系统集成了VR技术和Web GIS，为自然灾害的灾情展示提供了一种新的方式。其沉浸式、交互式、360°全覆盖的灾情展示模式有助于指挥部领导专家、公众和媒体工作者深度体会灾区情景、全面了解灾区情况、感同身受地体验灾区的灾情、应急救援进展等，在应急管理辅助决策、主动公开信息、应对谣言、服务公众方面具有积极作用。系统提供的解决方案，无需额外的设备和经济投入，仅需2 min即可提供灾区的全景展示服务。