百度地图API怎样实现拖动标注实时更新位置数据

2025-04-15 12:10:54
推荐回答(1个)
回答1:

首先应用百度地图API:






下面的是script中的代码:

var map = new BMap.Map("l-map");
map.centerAndZoom("北京",14); // 初始化地图,设置城市和地图级别。

var ac = new BMap.Autocomplete( //建立一个自动完成的对象
{"input" : "suggestId"
,"location" : map
});
var point = new BMap.Point(经纬度坐标);
map.centerAndZoom(point,14);
var geoc = new BMap.Geocoder();

var marker = new BMap.Marker(point);// 创建标注
map.addOverlay(marker); // 将标注添加到地图中
marker.enableDragging(); //设置可拖拽
marker.addEventListener("dragend", function(e){ //拖动事件
var pt = e.point;
var dizhi;
geoc.getLocation(pt, function(rs){
var addComp = rs.addressComponents;
dizhi = addComp.city + addComp.district + addComp.street + addComp.streetNumber;
document.getElementById('suggestId').value = dizhi;//更新地址数据
var content = dizhi + "

经度:" + e.point.lng + "
纬度:" + e.point.lat;
var infoWindow = new BMap.InfoWindow("

" + content + "

");
marker.openInfoWindow(infoWindow,map.getCenter());//将经纬度信息显示在提示框内
});
document.getElementById("zuobiao").value = e.point.lng + ", " + e.point.lat;//打印拖动结束坐标。