js 实现精准定位(使用百度地图API)

获取定位城市

在这里插入图片描述
使用百度地图API时记得申请AK
使用步骤如下
1.0 引用

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

2.0 使用

	<script>
		// 使用百度地图API功能
	    function useBaiduAPI() {
        var geoc = new BMap.Geocoder();
        var geolocation = new BMap.Geolocation();
        geolocation.getCurrentPosition(function (r) {
            if (this.getStatus() == BMAP_STATUS_SUCCESS) {
                var mk = new BMap.Marker(r.point);
                var pt = r.point;
                geoc.getLocation(pt, function (rs) {
                    var addComp = rs.addressComponents;
                    
                    // console.log(addComp.province + ", " + addComp.city + ", " + addComp.district + 
                    //     addComp.street + ", " + addComp.streetNumber)
                    // alert(addComp.district)
                    // 获取 区/县
                    if (addComp.district) {
                        $('#city').html(addComp.district)
                    } else {
                        $('#city').html('定位失败')
                    }
                });
            } else {
                alert('failed' + this.getStatus());
            }
        }, {
            enableHighAccuracy: true
        })
    }
	</script>

以上内容选取参照以下代码段

//百度
    layer.msg('正在定位,请稍后');
    var geolocation = new BMap.Geolocation({
        enableHighAccuracy: true, //是否使用高精度定位,默认:true
        timeout: 10000, //超过10秒后停止定位,默认:无穷大
        maximumAge: 0, //定位结果缓存0毫秒,默认:0
        convert: true, //自动偏移坐标,偏移后的坐标为高德坐标,默认:true
        showButton: true, //显示定位按钮,默认:true
        buttonPosition: 'LB', //定位按钮停靠位置,默认:'LB',左下角
        buttonOffset: new BMap.Pixel(10, 20), //定位按钮与设置的停靠位置的偏移量,默认:Pixel(10, 20)
        showMarker: true, //定位成功后在定位到的位置显示点标记,默认:true
        showCircle: true, //定位成功后用圆圈表示定位精度范围,默认:true
        panToLocation: true, //定位成功后将定位到的位置作为地图中心点,默认:true
        zoomToAccuracy: true //定位成功后调整地图视野范围使定位位置及精度范围视野内可见,默认:false
    });
    geolocation.getCurrentPosition(function(r) {
        if (this.getStatus() == BMAP_STATUS_SUCCESS) {
            mk = new BMap.Marker(r.point);
            getAddress(r.point);
        } else {
            alert('failed' + this.getStatus());
        }
    });
  • 0
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值