HTML5 安卓|苹果浏览器获取经度和纬度(百度API)

2018年08月13日 1,648 次阅读 0 条评论 291 人点赞

有时候需要用户注册时所处的地理位置信息,所以H5获取地图经纬度及地址信息也是不少开发者会遇到的,当然通过微信或小程序内置的功能就不存在这个问题了 由于H5自带的navigator.geolocation在IOS下获取位置失效,通过百度API获取用户位置信息可以解决这一个问题 调用百度地图BMap Geolocation获取对应的经度和纬度进而获取地区信息

有时候需要用户注册时所处的地理位置信息,所以H5获取地图经纬度及地址信息也是不少开发者会遇到的,当然通过微信或小程序内置的功能就不存在这个问题了 由于H5自带的navigator.geolocation在IOS下获取位置失效,通过百度API获取用户位置信息可以解决这一个问题调用百度地图BMap Geolocation获取对应的经度和纬度进而获取地区信息,优点是比较准确,缺点是需要用户确认 当然通过IP也可以获取到,不过就看你是否对精确度有要求了

<script type="text/javascript" src="https://api.map.baidu.com/api?v=2.0&ak=密钥"></script>
<script>
    // 百度地图API功能
    var map = new BMap.Map("allmap");
    var point = new BMap.Point(108.95,34.27);
    map.centerAndZoom(point,12);

    var geolocation = new BMap.Geolocation();
    geolocation.getCurrentPosition(function(r){console.log(r.point)
        if(this.getStatus() == BMAP_STATUS_SUCCESS){
            var mk = new BMap.Marker(r.point);
            map.addOverlay(mk);//标出所在地
            map.panTo(r.point);//地图中心移动
            var point = new BMap.Point(r.point.lng,r.point.lat);//用所定位的经纬度查找所在地省市街道等信息
            var gc = new BMap.Geocoder();
            gc.getLocation(point, function(rs){
                /* var addComp = rs.addressComponents;
                 console.log(rs.address);//地址信息*/
                console.log(r.point.lng);
                console.log(r.point.lat);
                console.log(rs.address);
            });
        }else {
            alert('暂时获取不到位置信息'+this.getStatus());
        }
    },{enableHighAccuracy: true})
</script>

把代码放到服务器,直接访问就可以看到效果了哦!

讲梦想、讲奋斗可以,前提是钱要给够。

文章评论(0

接收回复邮件通知
非注册会员初次评论需要审核,审核时间(09:00-18:00),请耐心等待...