快速的基于百度地图的搜索功能实现（存档）

1、结合前一篇的标注功能，以下可直接在搜索页面中添加一个DIV层的搜索功能

<div id="tools"  style="left:100px;top:5px;position: absolute;"><INPUT id=PoiSearch  name=word maxLength=256 >
<SELECT NAME="field" ID="field">
	<OPTION VALUE="">---请选择---</OPTION>
	<OPTION VALUE="land" SELECTED>地块</OPTION>
</SELECT>
    <INPUT TYPE="button" VALUE="搜索" ONCLICK="search()">
</div>

 

2、并在地图初始化脚本区中，添加搜索方法，以有结合业务搜索结果数据标注到地图上

//初始化地图参数
........

var land_name = "";
var land_intro = "";
/*
 * 展示地块窗口，并把地图中心位置移动到相应位置
 */
function markCurrentLand(point,marker,isopen){
	/*var opts = {
  		  width : 350,     // 信息窗口宽度
  		  height: 150,     // 信息窗口高度
  		  title : land_name  // 信息窗口标题
	}*/
	//已成功标注到地图，显示信息到地图
	var sContent =
	"<h4 style='margin:0 0 5px 0;padding:0.2em 0'>"+land_name+"</h4>" + 
	"<img style='float:right;margin:4px' id='imgDemo' src='images/gongshuRMZFBuilding.jpg' width='139' height='104' title='**区'/>" +
	"<p style='margin:0;line-height:1.5;font-size:13px;text-indent:2em'>用地性质:出让面积:地块介绍:"+land_intro+"</p>" +
	"</div>";
	//var infoWindow = new BMap.InfoWindow(sContent,opts);  // 创建信息窗口对象
	var infoWindow = new BMap.InfoWindow(sContent);  // 创建信息窗口对象
	map.addOverlay(marker); //添加图标

	if(isopen){
		setTimeout(function(){
			map.panTo(point); //移动到当前对象
			map.openInfoWindow(infoWindow, point);      // 打开信息窗口
		}, 1000);
	}
			
	marker.addEventListener("click", function(){
       	this.openInfoWindow(infoWindow);
		//图片加载完毕重绘infowindow
	    document.getElementById('imgDemo').onload = function (){
		   infoWindow.redraw();
	    }
	});
}

//编写自定义函数,创建标注
function addMarker(point, index){
	//比如一些自定义图片http://api.map.baidu.com/img/markers.png  http://openapi.baidu.com/map/images/custom_a_j.png  http://openapi.baidu.com/map/images/us_mk_icon.png
  var myIcon = new BMap.Icon("http://api.map.baidu.com/img/markers.png", new BMap.Size(23, 25), {
    offset: new BMap.Size(10, 25),                 // 指定定位位置
    imageOffset: new BMap.Size(0, 0 - index * 25)   // 设置图片偏移
  });
  var marker = new BMap.Marker(point, {icon: myIcon});
  map.addOverlay(marker);
  markCurrentLand(point,marker,false);
}

/*
 * 本地搜索 定位
 */
function search(){ 
	var searchStr = document.getElementById("PoiSearch").value;
	var type = document.getElementById("field").value;
	var act = "";
	if(type=="land"){
		act="getLandByName";
	}
	//业务表的查询
	//通过UCAP应用平台(或其它第三方AJAX框架获取数据)，到数据库中更新位置
	var rs = parent.bdgUtil.synchronization("type="+type+"&act="+act+"&searchStr="+searchStr);
	map.clearOverlays();//清除所有覆盖物
	if(rs&&rs.length>=1){
		for(var i=0;i<rs.length;i++){
			land_name = rs[i].land_name;
			land_intro = rs[i].land_intro;
			var newPoint = new BMap.Point(rs[i].land_x, rs[i].land_y); // 创建点坐标
		    addMarker(newPoint, i);
		}
	}else{
		
	}
	map.addOverlay(polyline);//画定**区边界
	//百度地图的查询
	//var local = new BMap.LocalSearch(map, {
	//	  renderOptions:{map: map}
	//	});
	//local.search(searchStr);
}

</script>

 3、功能页面