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

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

phonegap 调用百度地图实现定位,导航,周边查询

 

最近需要实现phonegap的地图功能,用javascript来实现,感觉比较傻而且很多功能开发也麻烦,想着用原生的地图来实现,但是会很麻烦需要用sdk包,还要写界面很麻烦。研究了一两天,发现百度可以试用URL api来实现调用本地地图来实现相关功能。所以话了2天时间来写了个插件。

原理不说了 直接上代码来说说怎么弄。

我这里只写了3个接口:

定点地址显示

周边相关商家查询

地址交通导航

 

1.添加java代码。可以按照一般插件的模式来安装。

pgbaidumap.java

 

2.添加js文件到www文件下面。

pgbaidumap.js

 

4.在config.xml文件里面声明插件。

<plugin name=”pgbaidumap” value=”com.breadth.pgtest.pgbaidumap”/>

5在index.html里面引入js文件

6.写方法实现调用:

html:

 

 

<button onclick=”baiduljdh(‘红庙坡’,’西门’,’西安’);”>原生地图路线导航1</button>
<button onclick=”baiduljdh(‘天安门’,’四惠桥’,’北京’);”>原生地图路线导航2</button>
<button onclick=”baiduad(‘北京市创新乐知信息技术有限公司’);”>原生地址查询1</button>
<button onclick=”baiduad(‘西安市雁塔西路124号’);”>原生地址查询2</button>
<button onclick=”pgbaidumapsearch(‘西安市’,’小肥羊’);”>原生附近搜索1</button>
<button onclick=”pgbaidumapsearch(‘深圳市’,’酒店’);”>原生附近搜索2</button>

 

js:

 

周边查询

function pgbaidumapsearch(city,query){
var cityloc = adtoloc(city);
console.log(cityloc);
window.plugins.pgbaidumap.pgbaidumapsearch(
city,query,cityloc,
function(success) {
alert(“Encode success: ” + success);
}, function(fail) {
alert(“Encoding failed: ” + fail);
});
}

定点地址显示
function baiduad(ad){
var loca = adtoloc(ad);
console.log(loca);
window.plugins.pgbaidumap.pgbaidumapad(
ad,loca,
function(success) {
// alert(“encode success: ” + success);
}, function(fail) {
// alert(“encoding failed: ” + fail);
}
);
}

交通导航
     function baiduljdh(form,to,reg){
window.plugins.pgbaidumap.pgbaidumapljdh(
form,to,reg,
function(success) {
alert(“encode success: ” + success);
}, function(fail) {
alert(“encoding failed: ” + fail);
}
);
}

 

插件下载:phonegap-baiditu

该插件属于内部使用暂不公开下载,见谅!

 

作者:夜阑小雨
原文链接:phonegap 调用百度地图实现定位,导航,周边查询
夜阑小雨版权所有,转载本网站文章时请保留此信息。

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

评论信息

0 条评论 发表评论

发布评论

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

网站客户端下载