1、初始化LocalSearch控件
LocalSearch = new BMap.LocalSearch(map, { renderOptions : { map : map, panel : "r-result" }, onResultsHtmlSet : function(container) { $("#r-result-container").show(); }, onInfoHtmlSet:function(poiInfo){ if(poiInfo){ var infoWindow=map.getInfoWindow(); var content='<div style="font:12px arial,simsun,sans-serif;margin-top:10px;170px;">' +'<table cellspacing="0" style="overflow:hidden;table-layout:fixed;100%;font:12px arial,simsun,sans-serif" >' +'<tr><td style="vertical-align:top;38px;white-space:nowrap;word-break:keep-all">地址: </td>' +'<td style="line-height:16px;140px;">'+poiInfo.address+' </td></tr>' +'<tr><td style="vertical-align:top;">电话:</td>' +'<td>'+poiInfo.phoneNumber+'</td></tr>' +'<tr><td colspan="2"><hr></td><td></td></tr>' +'<tr><td style="vertical-align:top;">操作:</td>' +'<td><a href="javascript:void(0)"><b>设为目的地址</b></a></td></tr></table></div>'; infoWindow.setContent(content); infoWindow.redraw(); } } });
2、编写LocalSearch执行的方法
function doLocalSearch() { var keyWord= $("#keyWord").val(); var mapZoom = map.getZoom(); if (mapZoom < 12) { $.messager.alert("提示", "当前搜索面积太广,请将地图放大到市级别后再搜索", "warning"); return false; } if (keyWord== "") { $.messager.alert("提示", "请输入搜索关键字", "warning"); return false; } LocalSearch.searchInBounds(keyWord, map.getBounds()); }
注:查询出来的结果看似无法操作,查看API就会发现InfoWindow窗体可以获取修改它显示的内容,甚至于每个查询的结果都可以进行自定义操作如查询的结果面板和地图上查询添加的Marker等。LocalSearch搜索完成后自动打开一个窗口,获取打开的窗体的方法是:map.getInfoWindow();