PhoneGap中文网

 找回密码
 立即注册
查看: 27898|回复: 6
打印 上一主题 下一主题

phonegap利用百度地图实现定位

[复制链接]

493

主题

2035

帖子

6894

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6894
跳转到指定楼层
楼主
发表于 2014-7-8 21:49:15 | 只看该作者 |只看大图 回帖奖励 |倒序浏览 |阅读模式
我们都知道无论用原生开发的程序,还是用phoengap调用原生接口开发的程序,实现定位的时候总是不理想,下面给大家分享一个利用百度地图定位的方法

phonegap利用百度地图定位

1.http://developer.baidu.com/map/jsdemo.htm  打开这个网址

2.找到  服务示例-定位服务 -浏览器订单  如下图



也可以获取代码一下他的示例代码:


最后核心代码如下

  1. <script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script>

  2. var geolocation = new BMap.Geolocation();
  3. geolocation.getCurrentPosition(function(r){
  4.     if(this.getStatus() == BMAP_STATUS_SUCCESS){
  5.       
  6.        // alert('您的位置:'+r.point.lng+','+r.point.lat);
  7.    
  8.    
  9.     var longitude=r.point.lng;//经度
  10.     var latitude=r.point.lat; //纬度
  11.         
  12.         
  13.         
  14.     }
  15.     else {//失败的回调函数        
  16.     //错误回调   
  17.         
  18.     //alert('failed'+this.getStatus());
  19.     }        
  20. },{enableHighAccuracy: true});
复制代码


回复

使用道具 举报

0

主题

7

帖子

24

积分

新手上路

Rank: 1

积分
24
沙发
发表于 2014-7-9 15:32:05 | 只看该作者
通过这种方式获取的经纬度信息,偏差太大了
回复 支持 反对

使用道具 举报

493

主题

2035

帖子

6894

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6894
板凳
 楼主| 发表于 2014-7-20 11:07:17 | 只看该作者
wyz191 发表于 2014-7-9 15:32
通过这种方式获取的经纬度信息,偏差太大了

还可以以吧,原生也有偏差,感觉自己的设备好的话可以用原生
回复 支持 反对

使用道具 举报

0

主题

7

帖子

24

积分

新手上路

Rank: 1

积分
24
5#
发表于 2014-7-22 08:30:20 | 只看该作者
嗯,获取经纬度后需要再转换一下才可以
回复 支持 反对

使用道具 举报

0

主题

7

帖子

24

积分

新手上路

Rank: 1

积分
24
6#
发表于 2014-7-22 08:33:31 | 只看该作者
本帖最后由 wyz191 于 2014-7-22 08:36 编辑
  1. <script type="text/javascript">
  2. document.addEventListener('deviceready',onDeviceReady,false);
  3. function onDeviceReady(){
  4.     getLocation();
  5. }
  6. function getLocation()
  7. {
  8.     try{
  9.         if(navigator.geolocation){
  10.             navigator.geolocation.getCurrentPosition(showMap, handleError, {enableHighAccuracy:true, maximumAge: 3000, timeout: 5000});
  11.         }else{
  12.             alert("您的浏览器不支持使用HTML 5来获取地理位置服务");
  13.         }
  14.     }catch(err){
  15.         alert(err);
  16.     }
  17. }

  18. function showMap(value){//地图初始化

  19.     try{
  20.         var longitude = value.coords.longitude;
  21.         var latitude = value.coords.latitude;
  22.         
  23.         alert('GPS : '+longitude+" -- "+latitude);

  24.         var map = new BMap.Map("map");
  25.         var point = new BMap.Point(longitude, latitude);    // 创建点坐标
  26.         map.centerAndZoom(point, 15);
  27.         var labelgps = new BMap.Label("我是GPS标注哦",{offset:new BMap.Size(20,-10)});
  28.         var marker = new BMap.Marker(new BMap.Point(longitude, latitude));  // 创建标注
  29.         marker.setLabel(labelgps); //添加GPS标注
  30.         map.addOverlay(marker);
  31.         map.addControl(new BMap.NavigationControl());
  32.         //坐标转换完之后的回调函数
  33.         translateCallback = function (point){
  34.             var marker = new BMap.Marker(point);
  35.             map.addOverlay(marker);
  36.             var label = new BMap.Label("我是百度标注哦",{offset:new BMap.Size(20,-10)});
  37.             marker.setLabel(label); //添加百度label
  38.             map.setCenter(point);
  39.             alert(point.lng + "," + point.lat);
  40.             var myGeo = new BMap.Geocoder();
  41.             // 根据坐标得到地址描述
  42.             myGeo.getLocation(point, function(result){
  43.                               if (result){
  44.                               var province = result.addressComponents.province ;
  45.                               var city = result.addressComponents.city;
  46.                               var district = result.addressComponents.district ;
  47.                               var street = result.addressComponents.street ;
  48.                               var streetNumber = result.addressComponents.streetNumber ;
  49.                               alert(province + ' - ' +city + ' - ' +district+ ' - ' +street + ' - ' + streetNumber);
  50.                               }
  51.                               });
  52.         }

  53.         setTimeout(function(){
  54.                    BMap.Convertor.translate(point,0,translateCallback);     //真实经纬度转成百度坐标
  55.                    }, 2000);
  56.     }catch(err){
  57.         alert(err);
  58.     }
  59. }
  60. function handleError(value)
  61. {
  62.     alert('handleError:'+value);
  63.     switch(value.code){
  64.         case 1:
  65.         console.log("位置服务被拒绝");
  66.         break;
  67.         case 2:
  68.         console.log("暂时获取不到位置信息");
  69.         break;
  70.         case 3:
  71.         console.log("获取信息超时");
  72.         break;
  73.         case 4:
  74.         alert("未知错误");
  75.         console.log("未知错误");
  76.         break;
  77.     }
  78. }
  79. </script>
复制代码


回复 支持 反对

使用道具 举报

493

主题

2035

帖子

6894

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
6894
7#
 楼主| 发表于 2014-10-16 19:02:26 | 只看该作者
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

关闭

站长推荐 上一条 /1 下一条

ionic4视频教程

Archiver|手机版|小黑屋| PhoneGap中文网 ( 京ICP备13027796号-1 )  

GMT+8, 2024-11-23 03:39 , Processed in 0.053852 second(s), 29 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表