Web室内地图导览系统设计与实现
| 随着室内移动位置服务的快速发展，人们对室内地图表现效果提出更高的要求。但是传统的室内地图表现手法单一，多是以二维平面示意图为主。针对这一问题，采用Web GIS与Web GL技术，对导览系统设计、室内空间构建及室内路径导航进行研究，形成室内空间构建、路径导航功能实现的一套完整流程，实现室内地图导览、同楼层和跨楼层的混合空间表达、实时切换，规划导航等通用需求。解决用户室内寻路难点，为人们在室内空间自由活动提供了高效便利的位置服务指引。并以医院作为示例，制作了导览系统样例，验证系统设计与实现的合理性。 随着互联网技术的发展以及电子通信设备的普及，LBS(location based services基于位置服务) 在人们日常生活中发挥着无可替代的作用。并且人们在室内停留时间的增长，电子导览地图由室外向室内发展。室外导览地图中电子地图、影像地图、全景地图、三维地图以及多种数据混合表现手法已经满足人们的日常需求。与室外导览地图相比，室内以建筑物为制图对象，关注的是小区域、高精度、精细化的内部要素展现，且需要更多的交互性和实用性来满足需求。目前在室内地图的表达方面，为主流的依然是二维平面示意图，与用户的互动性差、表现手法单一，表现效果不佳。本文从导览系统设计、室内空间模型构建、导航功能以及其他功能实现三方面进行研究，采用Web GL、Arc GISServer、Ajax技 术 与Java Script脚 本 语 言、HTML5标准设计并开发出一个Web室内导览系统。将室内空间表达、路径导航功能实现形成一套完整的流程，实现了室内地图导览、同楼层和跨楼层的混合空间表达、实时切换，规划导航等通用需求。以二三维地图以及其他多媒体信息的方式为用户提供室内位置信息服务，具有直观生动、场景美观高效、互动性强等优点，能够满足各种应用场景需求，具备进一步商业化应用的潜力。 |
一、室内地图导览系统设计
- 1系统功能需求分析
大型室内场馆一般具有规模大、功能性分区多、楼层多等特点，要求系统尽可能简单、明了地对室内场景进行建模，能够实现跨楼层间的路径导航。整个系统包括地图基本操作、路径导航、多媒体信息展示三大模块。
- 2系统总体框架
采用B /S架构模式，程序部署和维护方便，易于扩展。数据层提供业务层所需的数据; 业务层通过Web GL实现室内的二三维建模，Arc GIS for Server将空间数据以地图服务的形式发布; 表现层在浏览器端显示室内模型。
二、室内空间模型构建
根据模型的构造特点将其大致分为几何空间模型、符号空间模型、语义空间模型三类。本文从几何空间建模流程、路径导航以及其他功能实现。1几何空间建模
在几何空间建模方面，本文采用基于Web GL的Three． js开源库进行快速二三维建模与渲染。Web GL结合了HTML5和Java Script，利用硬件3D加速渲染技术，借助显卡在浏览器上创建复杂三维虚拟场景，并允许用户与之进行交互，具有在浏览器加载速度快，GPU占用较小等优点。Web GL建模机制是在canvas上创建并初始化顶点着色器和片元着色器，根据模型对象的顶点坐标创建模型。与利用Sketch Up、3dmax等软件进行手工建模相比，建模方式简单，只需要一个文本编辑器和一个浏览器就可以创建、发布自己的模型。
2.1. 1数据获取与处理
获取建筑施工CAD图，各科室文字属性信息以及影像等数据。利用Esri Arcgis对CAD图进行处理、分析、编译转换成标准的矢量数据模型，并将矢量 数 据 转 换 成 轻 量 级JSON(javascript objectnotation) 数据，用于三维建模。
2.1. 2数据解析与场景构建
将处理后的JSON数据、影像数据存储在服务器中，浏览器解析数据时，与后台进行交互从而读取数据。本文主要通过Java Script的prototype属性向对象添加方法属性———load Ajax JSON，用于动态加载和解析存储于服务器中的外部JSON对象。其中load Ajax JSON方 法 主 要 包 括JSON． parse方 法、XMLHttpＲequest对 象。 JSON． prase方 法 用 来 将JSON字符串转化为对象。XMLHttpＲequest对象用于后台与服务器进行数据交换。场景构建使用Three．js解析JSON数据构建场景。Three．js封装Web GL底层代码，用面向对象的方式来创建3D场景如摄像机、光影、材质等各种对象，且内置了强大的功能库，如矩阵和矢量运算，交互功能等。
2.1.3场景切换、缩放与旋转
二 三 维 场 景 的 切 换 主 要 通 过DOMcreate Element( ) 方法以及自定义的show Floor( ) 方法属性进行地图切换与显示。地图的缩放与旋转是Three．js的功能属性，通过Three． js创建的场景都可以实现场景的缩放与旋转。具体的场景如图所示，其中左侧的F1、F2用于楼层的切换，右上的3D、2D用于二三维场景切换。
三、导航及其他功能实现
3.1导航功能
3.1. 1路径分析
Arc GIS Server发布网络地图以及网络分析服务，并将Arc GIS API For Java Script部署在本地Internet信息服务(IIS) 中，通过调用Arc GIS API实现客服端和服务器的交互。同楼层导航通过调用该层的网络分析服务获取到最优路径。跨楼层导航通过起始，终点位置信息判断中间站点( 电梯或者楼梯) ，调用两次网络分析服务获得最优路径。
3.1. 2路径显示
Arc GIS Server后台软件分析出路径后，将路径信息转换至JSON数据格式。解析JSON数据，并将地理坐标转换至屏幕坐标。
3.2多媒体信息展示
3.2. 1图层标记
图层标记通过浮层处理来进行，即针对室内三维地图上绘制的覆盖物，包括以下几类:
(1) 线标记: 线标记用来在室内地图中每两点之间画出直线，一般表示地图路径。其中主要应包括一个数组用来指定线标记所涵盖的路径坐标点，线宽度、线的颜色等;
(2) 文字标记: 文字标记用于在地图之上绘制文字，表明每个房间、科室的名称;
(3) 图片标记: 用图像在三维地图上对特殊点位进行标记，更加的直观便利。可以通过Three． js的Image Loader属性，或建立几何图，进行纹理贴图等多种方法实现。
- 2. 2其他信息展示
其他信息展示通过Java Script语言进行编写。主要包括科室的描述性属性信息、影像信息。当用户点击三维场景中的某一房间时，弹出文字、图片的信息框。为更好地提供服务，将不同功能房间设置成不同颜色，进行房间分类显示。如洗漱室、楼梯、大厅为公共区域，医生的诊断室、住房区等不同功能性房间进行分类。
四、结语
本文以Three．js，Arc GIS API为技术手段，遵循Web应用程序设计原则，实现室内二三维地图的展示、漫游、查询以及导航等功能的室内导览系统。研究以Three．js方式进行二三维地图建模，以医院为具体的应用案例，实现了一二楼室内导览系统的建模、多媒体信息展示、跨层导航等功能。系统受众广泛，可以发布网络服务器，也可部署至这些场馆大厅的触摸屏，移植到手机端等，具有极大的实用性及适应性。该种室内导览地图实现手段不仅建模效率高、Web端加载速度快，渲染效果好、表现形式更加的多样化，对同类的室内导览系统的设计与实现提供一种可参考方法。