html部分:
<div id="allmap"></div>
<style type="text/css"> body, html{width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";} </style>
js部分:
<script defer type="text/javascript"> // 百度地图API功能 var x=""; var y=""; var map = new BMap.Map("allmap"); var point = new BMap.Point(116.404, 39.915); map.centerAndZoom(point , 11); var marker = new BMap.Marker(point); // 创建标注 map.addOverlay(marker); // 将标注添加到地图中 setTimeout(function(){ map.setZoom(14); }, 1000); //2秒后放大到14级 map.enableScrollWheelZoom(true); //缩放地图 map.addEventListener("click", showInfo); function showInfo(e){ x=e.point.lng; //获取鼠标当前点击的经纬度 y=e.point.lat; if(x != "" && y != ""){ clearAll(); //清除地图上存在的标注 var point = new BMap.Point(x,y); map.centerAndZoom(point); marker = new BMap.Marker(point); // 创建新的标注 map.addOverlay(marker); //将标注添加到地图上 }else{ map.centerAndZoom("北京", 12); }
var point = new BMap.Point(x,y); //获取当前地理名称 var gc = new BMap.Geocoder(); gc.getLocation(point, function(rs){ var addComp = rs.addressComponents; alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber); });} function clearAll(e){ map.removeOverlay(marker); }</script>
样式截图: