百度地图拖动标注输出当前定位坐标及街道信息

最新推荐文章于 2021-11-24 13:08:48 发布

weixin_33862188

最新推荐文章于 2021-11-24 13:08:48 发布

阅读量145

点赞数 1

文章标签： javascript python ViewUI

原文链接：https://my.oschina.net/u/914487/blog/897367

版权

2019独角兽企业重金招聘Python工程师标准>>>

<!DOCTYPE html>  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>百度地图Demo</title>  
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>  
</head>  
<body>  
<div style="width:520px;height:340px;border:1px solid gray" id="container"></div>  
</body>  
</html>  
  
<script type="text/javascript">  
var map = new BMap.Map("container");//初始化地图                      
map.addControl(new BMap.NavigationControl());  //初始化地图控件                
map.addControl(new BMap.ScaleControl());                     
map.addControl(new BMap.OverviewMapControl());                
var point=new BMap.Point(116.404, 39.915);  
map.centerAndZoom(point, 15);//初始化地图中心点  
var marker = new BMap.Marker(point); //初始化地图标记  
marker.enableDragging(); //标记开启拖拽  
  
var gc = new BMap.Geocoder();//地址解析类  
//添加标记拖拽监听  
marker.addEventListener("dragend", function(e){  
    //获取地址信息  
    gc.getLocation(e.point, function(rs){  
        showLocationInfo(e.point, rs);  
    });  
});  
  
//添加标记点击监听  
marker.addEventListener("click", function(e){  
   gc.getLocation(e.point, function(rs){  
        showLocationInfo(e.point, rs);  
    });  
});  
  
map.centerAndZoom(point, 15); //设置中心点坐标和地图级别  
map.addOverlay(marker); //将标记添加到地图中  
  
//显示地址信息窗口  
function showLocationInfo(pt, rs){  
    var opts = {  
      width : 250,     //信息窗口宽度  
      height: 100,     //信息窗口高度  
      title : ""  //信息窗口标题  
    }  
      
    var addComp = rs.addressComponents;  
    var addr = "当前位置：" + addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber + "<br/>";  
    addr += "纬度: " + pt.lat + ", " + "经度：" + pt.lng;  
    //alert(addr);  
      
    //var infoWindow = new BMap.InfoWindow(addr, opts);  //创建信息窗口对象  
    //marker.openInfoWindow(infoWindow);  
	alert(addr);
}  
</script>

效果图: