当前时间:Sunday 2016年12月04日 欢迎访问 夜阑小雨 我的学习碎片档案,这里记录了我的学习内容和工作中经验,希望给您带去帮助。

当前位置: 首页 >> ios,phonegap开发 >> 正文

phoengap-ios-地图插件开发

phoengap的ios插件介绍:

主要功能:

1.地图定点标记

2.当前位置定位

3.自驾车路线

4.公交路线

5.步行路线

 

以下为效果图:

03 04 02

 

本插件是基于mapkit开发,没有引入第三方地图sdk。算是比较轻量级的。

 

使用方法:

1.下载map插件包。

2.添加”MapKit” framework 到你的项目中。

3.复制 .h 和 .m 到你的项目plugins中。

4.引入js文件到的hml文件中。其中MapKit.js 为插件文件,不要改动。map.js是我开发的一些方法,直接调用,最好不要修改。但是可以做一些自己的调整。

5.在你需要的地方使用以下方法。两个参数 第一个为标记点的名称,第二个参数为该标记点的地址,越详细越好。

adtoloc(“火车站”,”陕西省西安火车站”);

以下为完整的调用:

<div title=”地图” class=”panel” id=”dituTemplate” data-load=”map” data-header=”maphead”>
<script>
function map(){
adtoloc(“火车站”,”陕西省西安火车站”);
}
</script>
<div >
<span style=”float:left”><a href=”javascript:dingwei();”><img src=”images/custom_loc.png” style=”width:50%; margin:5px” /></a></span>
<span style=”float:left; width:68px;padding:5px”><a href=”javascript:jiache();”>驾车导航</a></span>
<span style=”float:left;width:68px;padding:5px”><a href=”javascript:bus();”>公交导航</a></span>
<span style=”float:left;width:68px;padding:5px”><a href=”javascript:buxing();”>步行导航</a></span>
</div>
</div>

6.改方法代用后,会在当前的view 中创建一个子窗口来显示该地图。

在返回其他页面的时候调用

hideMap();      来隐藏该子窗口。

 

7.对于子窗口的大小,可以在MapKit.m 中修改。self.webView.bounds.size.height是整个窗口的高度,只需要修改后面的数字来减去你要预留的高度就是子窗口的高度,宽带为屏幕宽带,也可以自行修改。

self.webView.bounds.size.height-100

完成修改后就能正常使用该插件,当然对于路径规划,我这边也只做了简单的开发,在地图上画了路径图。至于要实现转折点标记及提示可以自己开发。

开发插件真不容易,对于我这边的web开发者来说,obj-c真是不懂。不过摸索着,学习着也能看懂。

 插件下载:phoengap-ios-map-插件【此插件暂时不公开使用】

做任何东西无非了解清楚原理,然后寻找一些方法,再找出相应的代码做一些修改和调试,成功也就不远了!

作者:夜阑小雨
原文链接:phoengap-ios-地图插件开发
夜阑小雨版权所有,转载本网站文章时请保留此信息。

收藏和分享: 转贴到开心网 转贴到校内网 分享到 Twitter Delicious 分享到 Google Reader 分享到 百度收藏 分享到 QQ收藏

所在分类:ios phonegap开发

评论信息

2 条评论 发表评论
  1. 老大,能发下密码吗?正在做这个 不懂呢!

    夜阑小雨 回复:

    该插件不免费提供使用~

发布评论

您必须登录才能发表评论。

网站客户端下载