百度地图标注 基础篇

<script type="text/javascript">  
var mapObj = new BMap.Map("mapObj");          // 创建地图实例  
//向地图中添加缩放控件
var ctrl_nav = new BMap.NavigationControl({anchor:BMAP_ANCHOR_TOP_LEFT,type:BMAP_NAVIGATION_CONTROL_LARGE});
mapObj.addControl(ctrl_nav);
mapObj.enableDragging();//启用地图拖拽事件，默认启用(可不写)
mapObj.enableScrollWheelZoom();//启用地图滚轮放大缩小
mapObj.enableDoubleClickZoom();//启用鼠标双击放大，默认启用(可不写)
mapObj.enableKeyboard();//启用键盘上下左右键移动地图
//mapObj.centerAndZoom("<?php echo $defaultcity?>");
if(window.top.$('#<?php echo $field?>').val()) {
	drawPoints();
} else {
	mapObj.centerAndZoom("<?php echo $defaultcity?>");
}
var localSearch = new BMap.LocalSearch(mapObj);
   localSearch.enableAutoViewport(); //允许自动调节窗体大小

function keywordSearch() {
    mapObj.clearOverlays();//清空原来的标注
	var keyword = document.getElementById("keyword").value;
	 localSearch.setSearchCompleteCallback(function (searchResult) {
        var poi = searchResult.getPoi(0);
  //      document.getElementById("result_").value = poi.point.lng + "," + poi.point.lat;
        mapObj.centerAndZoom(poi.point, 13);
        var marker = new BMap.Marker(new BMap.Point(poi.point.lng, poi.point.lat));  // 创建标注，为要查询的地方对应的经纬度
        mapObj.addOverlay(marker);
        var content = document.getElementById("keyword").value + "<br/><br/>经度：" + poi.point.lng + "<br/>纬度：" + poi.point.lat;
        var infoWindow = new BMap.InfoWindow("<p style='font-size:14px;'>" + content + "</p>");
        marker.addEventListener("click", function () { this.openInfoWindow(infoWindow); });
        // marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
    });
    localSearch.search(keyword);
}

function drawPoints(){
	var data = window.top.$('#<?php echo $field?>').val();
	var data = data.split('|');
	var lngX = data[0];
	var latY = data[1];
	var zoom = data[2] ? data[2] : 10;
	mapObj.centerAndZoom(new BMap.Point(lngX,latY),zoom);
	// 创建图标对象
	var myIcon = new BMap.Icon('<?php echo IMG_PATH ?>icon/mak.png', new BMap.Size(27, 45));

	// 创建标注对象并添加到地图
	var center = mapObj.getCenter();
	var point = new BMap.Point(lngX,latY);
	var marker = new BMap.Marker(point, {icon: myIcon});
	marker.enableDragging();
	mapObj.addOverlay(marker);
	var ZoomLevel = mapObj.getZoom();
	marker.addEventListener("dragend", function(e){  
		window.top.$('#<?php echo $field?>').val(e.point.lng+'|'+e.point.lat+'|'+ZoomLevel); 
	}) 
}

function addMarker(){ 
	  mapObj.clearOverlays();
	  // 创建图标对象
	  var myIcon = new BMap.Icon('<?php echo IMG_PATH ?>icon/mak.png', new BMap.Size(27, 45));
	
	  // 创建标注对象并添加到地图
	  var center = mapObj.getCenter();
	  var point = new BMap.Point(center.lng,center.lat);
	  var marker = new BMap.Marker(point, {icon: myIcon});
	  marker.enableDragging();
	  mapObj.addOverlay(marker);
	  var ZoomLevel = mapObj.getZoom();
	  window.top.$('#<?php echo $field?>').val(center.lng+'|'+center.lat+'|'+ZoomLevel);
	  marker.addEventListener("dragend", function(e){  
		window.top.$('#<?php echo $field?>').val(e.point.lng+'|'+e.point.lat+'|'+ZoomLevel); 
	}) 
}

function mapClose(){
	var CityBox=$(".CityBox");
	if(CityBox.css('display')=='none'){
		CityBox.show();
	}else{
		CityBox.hide();
	}
}

function removeMarker() {
	mapObj.clearOverlays();
	mapObj.centerAndZoom("<?php echo $defaultcity?>");
	$("#curCity").html('<?php echo $defaultcity?>');
	window.top.$('#<?php echo $field?>').val('');
}
</script>