SuperMap iClient 6R(2012)与轻量级移动端开发

SuperMapiClient系列产品提供了多种Web API,除了支持在PC端设计开发应用系统之外,还能够支持移动终端开发,而且相比于移动端的原生开发语言而言,SuperMap iClient采用的是Web API,开发难度低,可以快速上手实践,再加上其特有的跨终端和跨系统的能力,使得SuperMap iClient在移动开发方面具有一定的优势。特别的,对于这种基于WebAPI开发移动端Hybrid App的混合开发模式,我们称之为轻量级移动端开发,以下的内容也将围绕iClient的轻量级移动端开发展开。

目前推出的SuperMap iClient 6R(2012)的产品中,可以采用SuperMapiClient for JavaScript+HTML5+CSS的技术组合方式,开发HTML5的移动端应用;同时,也可以采用SuperMap Flex Mobile以及Adobe AIR的运行环境来搭建跨终端应用。针对这两种方式,我们来看看其中需要注意的技术要点:

1、 采用JavaScript+HTML5+CSS的技术组合搭建移动端浏览器上的网页,已经是众人的共识,因为包括iOS、Android、WindowPhone、Meego、BlackBerry等等系统中,已经内置了支持HTML5规范的Webkit浏览器内核,对于网页页面的渲染以及对于JavaScript脚本的解释都是基本一致的,所以也将浏览器兼容的难度也降低了。

同时,由于用户对于移动端App的认可以及操作方面的热爱,也使得HTML5产生了另外一种展现方式,也就是将网页也包装成为一种App——Hybrid App,而对于用户来说,也可以像使用原生App一样使用HTML5网页。

那么如何能够将HTML5页面包装为App呢?通常我们需要使用一些中间件型的框架实现混合模式开发,如下图所示的一些国内外知名中间件产品,关于这方面的介绍请查看各产品的详细介绍,这里不做过多说明。在SuperMap iClient for JavaScript产品包中,已经提供了一个基于PhoneGap制作的Hybrid App工程,基于PhoneGap开发的HTML5工程可以编译为iOS、Android等平台可运行的App,具体制作过程请参考http://support.supermap.com.cn:8090/iserver/iClient/forJavaScript/examples/mobileTopic.html

图1

部署到移动端后的效果如下图所示:

图2

由于在SuperMapiClient for JavaScript中对于移动端的手势操作做了内部的处理,支持的手势操作包括了两指缩放地图,单指双击放大地图,两指点击缩放地图,以及单指绘制几何要素,因此在开发过程中不需要做额外的手势处理。

在地图的相关功能方面,与浏览器网页系统功能一致,也就是包括了地图浏览,数据查询,各种分析服务,专题图,交通换乘,在线编辑,OGC规范,GPS定位等,当然其中很多功能依赖自在线的iServer或者第三方的服务,这也是轻量级移动端开发的特点。额外的,对于HybridApp的地图浏览方面,我们提供了两种离线地图的策略:

1) 离散图片文件:开启地图的storageType:File选项后,就会在用户浏览地图的时候,下载到指定的位置(通过PhoneGap或其他中间件设定),以便下次打开后可以继续浏览;

2) 数据库文件:开启地图的storageType:db选项,这里需要使用iServer或者MOBAC(MobileAtlas Creator,用于创建移动端离线地图的开源软件)创建的MBtiles SQLite数据库文件,放置到PhoneGap或其他中间件指定的位置,就会加载这种离线地图缓存包里面的数据了,那么使用这种方式就可以预先制作某一区域的地图缓存,然后由用户下载使用了,具体信息请参考离线开发的技术专题:http://support.supermap.com.cn:8090/iserver/iClient/forJavaScript/examples/mobileTopic.html

在跨终端的支持方面,也是HTML5的特点与优势。虽然是采用Hybrid开发模式,但是最终的渲染器依旧是Webkit,因此其跨终端的能力也取决于Webkit本身。针对于SuperMap iClient for JavaScript的兼容性情况如下图所示。需要注意的是,各种不同系统中浏览器对于手势操作的支持也有所不同,例如Android 2.3及其以下版本的很多浏览器不支持手势操作。

图3

2、 在Adobe AIR的运行环境基础上,使用SuperMap Flex Mobile(下载地址:http://support.supermap.com.cn/ProductCenter/DevelopCenterRefactoring/SuperMapFlexMobile.aspx)开发移动端App也是一种不错的选择。由于它是SuperMap iClient for Flex在移动端的衍生产品,除了部分地图修饰控件不再出现在SuperMap Flex Mobile中外,其功能与接口设计和原产品基本保持一致, 因此不再增加学习成本。

目前需要使用AdobeFlash Builder 4.6及其以上版本才能开发和编译基于Adobe AIR的移动端App,由于Adobe AIR具有跨终端的特点——iOS、Android、BlackBerry,因此可以在Flash Builder中编译出不同系统和设备——Pad和Phone的版本,也就是可以在这些移动设备中安装SuperMap Flex Mobile开发的App。在该产品的分发包中包括了可直接安装的程序,安装到设备中联网运行后的效果如下图所示。

图4

在功能方面,同样支持了手势操作的在线地图浏览,数据查询,各种分析服务,专题图,交通换乘,在线编辑,OGC规范,GPS定位等功能,并且也支持两种离线地图策略,离线文件型和MBTiles SQLite数据库型,具体用法可参考产品包中的开发指南。

需要说明的是,由于AdobeAIR在iOS中持续的改进和完善,以及Objective-C语言的学习和开发成本高的问题,因此SuperMap Flex Mobile非常适合开发iOS的Pad以及Phone设备中的应用。

最后,对这两种轻量级的移动开发模式的特点做个小结:

1、 开发包体积小,开发简化,周期短;

2、 支持在线/离线地图浏览;

3、 支持在线的SuperMap iServer GIS应用功能;

4、 支持超图云服务,百度/谷歌地图等第三方数据;

希望在SuperMap iClient产品的不断改进下,使得移动互联网中的GIS Apps能够更多更快的涌现出来。

Author:dulvyizhihua
原文地址:https://www.cnblogs.com/dulvyizhihua/p/2694476.html