百度地图获取经纬度和当前精确位置名称

最新推荐文章于 2025-06-26 14:52:33 发布

q876597923

最新推荐文章于 2025-06-26 14:52:33 发布

阅读量4k

点赞数 2

CC 4.0 BY-SA版权

文章标签：百度地图精确位置经纬度

本文链接：https://blog.youkuaiyun.com/q876597923/article/details/52217288

本文介绍如何在HTML中集成百度地图API，详细阐述了通过API获取当前地理位置的经纬度以及精确位置名称的方法，帮助开发者实现地图定位功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

html部分：

<div class="sign_add_left" style="height:123px;border:#ccc solid 1px;" id="dituContent"></div>

js部分：

<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=134db1b9cf1f1f2b4427210932b34dcb"></script>
<script type="text/javascript">
    var map = new BMap.Map("dituContent");
    var point = new BMap.Point(lng, lat);
    map.centerAndZoom(point, 12);
    map.enableScrollWheelZoom();
    var geolocation = new BMap.Geolocation();

    geolocation.getCurrentPosition(function (r) {
        if (this.getStatus() == BMAP_STATUS_SUCCESS) {
            var mk = new BMap.Marker(r.point);
            map.addOverlay(mk);
            map.panTo(r.point);
            var pt = r.point;
            var gc = new BMap.Geocoder();
            gc.getLocation(pt, function(rs){
            var addComp = rs.addressComponents;
            detail_address = addComp.district + addComp.street + addComp.streetNumber;
            address = addComp.province +  addComp.city + addComp.district + addComp.street + addComp.streetNumber;
            $("#address1").text(detail_address);
            $("#address2").text(address);
            })
            document.getElementById("lat").value = r.point.lat;
            document.getElementById("lng").value = r.point.lng;
//                    document.getElementById("h3").innerHTML = "";
        }
        else {
            alert('failed' + this.getStatus());
        }
    })
</script>