基于HTML5的移动GIS开发和应用.pdf

基于html5的移动gis开发和应用 html5移动的进化之路 基于html5的移动webgis应用 架构hybrid app的移动gis应用 目录 互联网之乱世 新兴移动市场 开发者选择html5非ios 一张图了解html5 /img/20120223/2012022311244443.jpg /uploadfile/2012/1008/20121008011823766.jpg html5移动应用的优势 移移动动表表单单元素元素移移动动表表单单元素元素 离离线缓线缓存存离离线缓线缓存存 动态图动态图例例动态图动态图例例 transition移移动动transition移移动动 地理位置定位地理位置定位地理位置定位地理位置定位 animation动动画画animation动动画画 transform变变形形transform变变形形 多媒体多媒体多媒体多媒体 音音频频音音频频 视频视频视频视频 canvas绘图绘图canvas绘图绘图 svg矢量矢量图图svg矢量矢量图图 css3css3 跨平台跨平台 易易上手上手 易分发易分发 响响应应式式设计设计响响应应式式设计设计 实时实时通通讯讯实时实时通通讯讯 html5移动app 基于html5的移动webgis应用 html5 app剖析 1、响应式设计 2、交互动效 3、native app风格 4、性能优化 html5 移动webgis的设计 arcgis api for javascript dojo mobile compact build jquery/appcelerator viewport 移动webgis框架 响应式web设计 目录结构 html主文件 与地图相关的 操作 与页面交互相 关的操作 响应式的css代码， 主要是media query 管理响应式 web的脚本 切片地图离线offlinetilesenabler 要素服务离线offlinefeaturesmanager arcgis js api离线功能 /esri/offline-editor-js arcgis webapp builder 零代码搭建webapp 适应多尺寸移动终端 内置常见widget 主题风格定制化 提供源码下载 可扩展 webapp演示 native的功能（拍照、通讯、native的程序入口 ） 用户交互体验（流畅运行，交互友好，更好的体验） 跨平台开发使用 但是，我们需要更多 架构hybrid app的移动gis应用 hybrid模式诞生 认识hybrid app native applicationmobile browserhybrid application hybrid apphybrid app兼具了兼具了native appnative app的原生优势，同时也兼具的原生优势，同时也兼具web appweb app使用使用html5html5跨平跨平 台开发优势！台开发优势！ 技术架构 hybird app技术分类 基础：webview 多view混合型appcan 单view混合型cordova(phonegap) web主体型 cordova(phonegap) 2011年10月， adobe收购了nitobi software和其phonegap产品，并提交到 apache incubator。 提供的产品：cordova + phonegap + adobe shadow 支持的移动操作系统：ios, android, ubunton phone os, blackberry, window phone, palm webos,bada和symbian。 实现原理 cordovainterface droidgapcordova webview appcan是本土移动开发的移动平台 appcan appcan类似phonegap的本土化加强版： 类似于phonegap的本地调用功能 封装了uexwindow多窗口机制，实现了移动 端的iframe效果。 不是开源项目，但有面向开发者的免费版，也有定 位于企业用户的企业版套装 titanium移动平台是所有移动开发平台中比较另类的。 调用js api实现，在发布时编译成native code，需要使 用titanium ide打包。 性能体验较好； 商业授权； 学习难度较高； 开发需要联网； titanium sencha touch phonejs jquery 其他移动开发框架 xamarin studio是一个用c#语言 开发跨平台应用的集成开发环 境，它和ios以及android sdk紧密整合 xamarin提供了for vs2010 vs2012的插件 xamarin hybrid app， 一个特定时期的特定产品，不同的期望不同的 选择。 移动gis开发策略 移动gis开发策略技术路线 native appweb apphybrid app 开发语言原生语言网页语言网页或原生语言 跨平台性低高高 设备能力高低高 开发难度高低低 应用体验好差较好 向后兼容差好好 arcgis api for javascript arcgis runtime sdk for mobile 移动gis开发策略应用分析 确定目