摘 要

当今互联网日新月异，各行各业都慢慢步入信息化时代，尤其是互联网技术与其他技术融合之后，将会迸发出更加强大的力量。基于目前html5的发展趋势和特性，我考虑将其应用到定位系统的展示模块，采用b/s模式，重新设计定位系统并实现。

广义谈及HTML5时，其实指的是包括JavaScript，CSS，HTML和在内的一套组合技术^[2]。它能够将使用插件来实现多功能性网络应用服务的网页浏览器的需求变得不再那么必要（Plug-in-Based Rich Internet Application，RIA）^[2]。例如：AdobeFlash、Microsoft Silverlight与Oracle JavaFX的需求，并且提供更多能有效加强网络应用的标准集

HTML5增加了更多样化的 API和一些新的特性：

1.本地存储性。

2.websocket--连接特性,允许我们双端通信。

3. 用于绘画的 canvas 元素,允许我们绘制地图

…

定位技术，在远古时期，人类便知道星历导航，如今发展到现在，已然成为了一个庞大的系统----地理信息系统（Geographic Information System或 Geo－Information system，GIS）。结合网页技术，衍生出了WEB-GIS（网络地理信息系统）技术。目前webgis的前端框架分为商业产品，公众服务产品和开源软件三大类，商业webgis框架有arcgis server api for javascript,supermap iclient for Javascript等，公众地图服务的产品有google maps api for javascript,百度地图javascript api等，开源webgis软件有openlayers javascript api,kamap,leaflet等,比较了它们之间的特征和实用性，最终选择了openlayers 3作为前端框架，而openlayer3地图格式解析并绘制正是利用了html5的canvas绘图api，结合html5的连接特性，完成定位就是系统需要设计和实现的重点。

关键词：webgis定位；html5；websocket；openlayers3

Abstract

The ever-changing Internet today, businesses are slowly into the information age, especially after the Internet technology and other technology integration, will burst out a more powerful force. Based on current trends and characteristics html5, I consider its application to the positioning system display module, using b / s mode, the positioning system redesign and implement.

Generalized talking about HTML5 when, in fact, is intended to include JavaScript, CSS, HTML, and including a combination of techniques [2]. It is possible to use plug-ins to the versatility of network applications and services Web browser needs become less necessary (Plug-in-Based Rich Internet Application, RIA) [2]. For example: AdobeFlash, Microsoft Silverlight and Oracle JavaFX needs, and provide more effective in strengthening the standard set of network applications

HTML5 adds more diverse API and some new features:

1. Local storage properties.

2.websocket-- connectivity features allow us to double-end communications.

3. For painting canvas element allows us to draw the map

...

Positioning technology, in ancient times, humans will know ephemeris navigation, and now to the present, has become a huge system ---- GIS (Geographic Information System or Geo-Information system, GIS). Combined with Web technology, derived from the WEB-GIS (geographic information system network) technology. Currently webgis front frame is divided into commercial products, public services and open source software products into three categories, business webgis framework arcgis server api for javascript, supermap iclient for Javascript and other public map service products google maps api for javascript, Baidu map javascript api and other open source software webgis openlayers javascript api, kamap, leaflet, etc., compare the features and usability between them, we chose openlayers 3 front-end framework, openlayer3 map format parsing and rendering took advantage of html5 canvas drawing api, combined with connectivity features html5, completing positioning systems is the need to design and implement focus.

Key Words：webgis location；html5；websocket；openlayers3

目 录

第1章 绪论 1

1.1研究背景： 1

1.2 国内外的研究现状 1

1.3 目的及意义： 2

第2章 基础理论和相关开发技术 3

2.1 定位相关技术概述 3

2.1.1 RFID技术 3

2.1.2 WIFI技术 4

2.1.3 Gis技术 4

2.1.4 MESH技术 4

2.2 系统相关技术 5

2.2.1 开发语言 5

2.2.2 前端webgis框架的选用 6

2.2.3 后台框架选取 6

2.2.4 技术可行性总结 7

第3章 系统需求分析 9

3.1 总体目标 9

3.2 系统业务功能需求 9

3.2.1 整体业务的功能流程 9

3.2.2 功能性需求 10

第4章 系统设计与实现 12

4.1 前端总体设计 12

4.1.1 前端页面设计与实现 12

4.1.2 前台地图显示设计与实现 13

4.1.3 前台通信和交互设计与实现 15

4.2 后台总体设计 16

4.2.1 后台结构设计与实现 17

4.2.2 后台quartz设计与实现 18

4.2.3 后台websocket设计与实现 18

第5章 系统测试与调试 21

5.1软件测试目的 21

5.2软件测试过程与方法概述 21

5.2.1软件测试过程 21

5.2.2常用软件测试方法 22

5.3测试环境 23

5.4测试结果 23

5.4.1黑盒测试 23

5.4.2 白盒测试 24

5.5测试总结 26

参考文献 28

附录A 29

致谢 37

第1章 绪论

1.1研究背景：