html5 百度地图app开发,利用HBuilder开发基于MUI的HTML5+app中百度地图定位功能

本篇教程探讨了利用HBuilder开发基于MUI的HTML5+app中百度地图定位功能，希望阅读本篇文章以后大家有所收获，帮助大家HTML5+CSS3从入门到精通 。

<

定位功能有两种方法：

首先要初始化内置地图：

var map = new plus.maps.Map("map");

这里黄色的map是html里面的id：

地图加载中...

1、调用GPS定位API(注意，使用了baidu和bd09ll参数，无需转换坐标)

1 plus.geolocation.getCurrentPosition(function(p) {

2         console.log(p.addresses);

3         console.log( p.coords.longitude);

4         console.log( p.coords.latitude);

5         var gpsPoint = new plus.maps.Point( p.coords.longitude,  p.coords.latitude);

6         map.centerAndZoom(gpsPoint, 19);

7

8     }, function(e) {}, {

9         provider: 'baidu',

coordsType: 'bd09ll'

});

2、使用h5+内置地图进行定位。

map.getUserLocation(function(state, pos) {

console.log(JSON.stringify(pos));

if(0 == state) {

map.centerAndZoom(pos, 16);

plus.maps.Map.reverseGeocode(pos, {}, function(event) {

var address = event.address; // 转换后的地理位置

var point = event.coord; // 转换后的坐标信息

var coordType = event.coordType; // 转换后的坐标系类型

alert("Address:" + address);

console.log(JSON.stringify(point));

console.log(coordType);

}, function(e) {

alert("Failed:" + JSON.stringify(e));

});

}

});

本文由职坐标整理并发布，希望对同学们有所帮助。了解更多详情请关注职坐标WEB前端HTML5/CSS3频道！