基于移动RIA与WebGIS街区购物平台设计和实现.docVIP

基于移动RIA与WebGIS街区购物平台设计和实现 　　摘要：以重庆市北碚城区为例，采用HTML5标准，运用地理信息系统技术、移动互联网及网络开发技术，进行基于移动RIA和WebGIS的网络平台设计与实现。完成以地理信息服务为载体的新型街区购物平台。将地理信息服务应用于传统网上购物，把网上浏览和线下实体店购物结合，探索一种新的购物模式。 关键词：移动RIA；WebGIS；购物平台 1 研究背景与目的 电子商务与传统商务模式各有优缺点。一方面，目前电子商务主要采用B2B，B2C和C2C等商业模式，这种纯虚拟购物模式经营服务范围广泛，便于商家通过网络推广商品。但是，它缺乏本地化、现实性和灵活性等服务特性，相关法律还有待进一步完善，时常发生消费者合法权益遭受侵害的事件。另一方面，传统购物方式能实现面对面交流，让消费者享受较好的售后服务，而且相关法律也比较健全。但是，城市之中实体店布局分散，消费者难以全面了解商品店铺的信息。以至于其在寻找适合自己所需商品的实体店过程中会花费大量的时间和精力。同时，商铺知名度也仅仅能覆盖到其周边的有限地区，销售对象比较单一，影响范围不够大，限制了商家拓展市场和增加销售额的营业需求。因此，整合网上购物与实体店购物的优势，探索一种更安全便捷的购物新方式，成为消费者和商家共同的社会需求。 本文拟通过将HTML5移动富客户端开发技术和WebGIS技术结合，把网上浏览和线下实体店购物结合，基于地理信息服务，搭建一个面向Android移动端的街区购物平台。让消费者可以基于地图，进行店面浏览、商品浏览、空间定位、路径导航及各种复杂空间分析等，同时为商家扩大宣传、拓展市场提供便利。 2 技术支撑 本系统采用以HTML5为代表的新一代移动富客户端技术，利用HTML5、CSS3和JavaScript的技术组合进行Web前端开发，对于简单的地图浏览功能，在客户端完成，复杂的空间查询与分析任务则由服务器完成，之后将结果传送到客户端进行输出。其中，涉及到的关键技术及其实现介绍如下： （1）HTML5标准下的关键技术 Canvas元素：Canvas元素是HTML5的一部分，允许脚本语言动态渲染位图像。在本街区购物平台设计中，一方面，在Canvas下，通过 JavaScript语言调用Google Maps API，将功能强大的 Google 地图服务潜入到本系统平台中，作为系统界面底图。另一方面，在Canvas构建的界面画布上，通过调用WebGL API进行硬件3D加速渲染，结合相关店面的栅格图像资料，对店面进行三维场景展示。 进行数据本地缓存，实现离线应用：HTML5中新增的Web storage存储机制可以进行key/value方式的数据存储，以特定的网络数据如地图信息等进行本地缓存。本研究项目主要通过调用其API，利用Web storage的sessionstorage 和localstorage两种本地存储类型，实现地图数据缓存。 （2）空间地理位置信息服务的实现 多方位置共享：本系统提供多方位置共享功能，通过调用手机内置GPS提供的接口，获取自身位置信息；同时利用Web SOCKET即“套接字”技术，建立服务器和客户端的通信，进行用户位置信息共享。 空间分析服务：本购物平台服务器端采用ArcGIS Sever作为GIS服务器，基于ArcObject 基础类库，提供强大的空间分析功能。 其它辅助技术：本系统在开发模式上选择基于组件式Web开发——Sencha Touch，利用PhoneGap技术实现对客户端软硬件资源的调用，基于Ajax异步传输技术，实现地图显示与数据传输的异步化，增强用户视觉体验。 3功能模块设计与实现 本平台将现实中的实体店虚拟化，在相对应的地图中进行标注和展示。主要面向用户为：店家、消费者。功能模块划分也从两个角度进行，具体如下： 消费者： 一、 浏览 提供两种商品浏览方式：一是基于地理位置，从地图中找到相应位置的店面，然后对店面里的商品进行浏览。二是基于商品或店面属性，在兴趣点搜索窗口中，输入属性信息，查询和定位到相应属性的店面和商品。 1、 常规：放大、缩小、漫游、鹰眼；2、基于三维场景，进行自动漫游，实现模拟逛街； 二、查询 1、 基于属性字段查询：基于商品名称及类别查询；基于商品价位查询；基于名称关键字查询店面；2、 基于空间位置查询 三、定位 1、确定自己的位置；2、多方好友位置信息共享，并标示于地图上；3、可以设置共同兴趣点，共享位置信息，并显示在用户移动端地图上，便于多方用户快速便捷地向目标店面聚集，使双方在购物时便捷地进行会合碰面。 四、导航