网页中调用百度地图显示公司位置并且红色标注

代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>网页中调用百度地图显示公司位置并且红色标注</title>
</head>

<body>
<div id="container" style="width:600px;height:230px;margin:auto;border:1px solid #ddd;overflow:hidden;"></div>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=1.3"></script>
<script type="text/javascript">
    var map = new BMap.Map("container"); //设置底图
    map.enableScrollWheelZoom();    //启用滚轮放大缩小,默认禁用
    map.enableContinuousZoom();     //启用地图惯性拖拽,默认禁用

    var localSearch = new BMap.LocalSearch(map);
    localSearch.enableAutoViewport(); //允许自动调节窗体大小
	function searchByStationName() {
		map.clearOverlays();//清空原来的标注
		var address = "南京宁海中学";//查询的详细地址
		localSearch.setSearchCompleteCallback(function (searchResult) {
			var poi = searchResult.getPoi(0);
			var lng =poi.point.lng;
			var lat =poi.point.lat;
			var point = new BMap.Point(lng,lat);
			var marker = new BMap.Marker(point);
			var label = new BMap.Label(address,{"offset":new BMap.Size(20,-20)});
			var infoWindow = new BMap.InfoWindow(address); 
			map.enableScrollWheelZoom();
			map.centerAndZoom(point, 15);
			marker.setLabel(label); 
			marker.addEventListener("click",function(){this.openInfoWindow(infoWindow);});
			map.addOverlay(marker);
			map.addControl(new BMap.NavigationControl());   
			map.addControl(new BMap.ScaleControl());   
			map.addControl(new BMap.OverviewMapControl());
						
			marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
		});
		localSearch.search(address);
	}
	searchByStationName();		
</script>
</body>
</html>

猜你喜欢

转载自blog.csdn.net/sysdzw/article/details/82357219