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

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