最近开发一个调用百度的页面用来定位搜索的,然后各种网上找,
map = new BMap.Map("container");//创建一个百度地图容器
map.centerAndZoom("上海市", 12);//初始化地图,12表示级别
也可以
var point = new BMap.Point(a, b);//ab代表经纬度
map.centerAndZoom(point, 12);
这样定位到你所想要的地址,然后添加各种控件,监听器什么的,百度地图api都有
举个例子:
map.addControl(new BMap.NavigationControl()); //添加默认缩放平移控件
addEventListener("onhighlight", function(e)//监听
当然这些都不是重点,最气人的就是添加一个搜索功能
var ac=new BMap.Autocomplete({ "input":"sjbdz_lianxdz", "location":map });
input绑定你输入的值
location表示搜索范围,然后会出现一个什么情况呢?
当你输入关键字提示后点击保存回清空input输入框的值。
然后初始化页面的时候就会一闪而过。网上搜索Autocomplete
初始化的时候就可以绑定搜索词。
上代码:
function baiduapi(){ map = new BMap.Map("container"); var a=document.getElementById("sjbdz_jingd").value; var b=document.getElementById("sjbdz_weid").value; if(a!=null && a!="" && b!=null && b!="" ){ var point = new BMap.Point(a, b); map.centerAndZoom(point, 12); }else{ map.centerAndZoom("上海市", 12); } var marker = new BMap.Marker(new BMap.Point(a, b)); // 创建标注,为要查询的地方对应的经纬度 map.addOverlay(marker); map.enableScrollWheelZoom(); //启用滚轮放大缩小,默认禁用 map.enableContinuousZoom(); //启用地图惯性拖拽,默认禁用 map.addControl(new BMap.NavigationControl()); //添加默认缩放平移控件 map.addControl(new BMap.OverviewMapControl()); //添加默认缩略地图控件 map.addControl(new BMap.OverviewMapControl({ isOpen: true, anchor: BMAP_ANCHOR_BOTTOM_RIGHT })); //右下角,打开 localSearch = new BMap.LocalSearch(map); localSearch.enableAutoViewport(); //允许自动调节窗体大小 //智能搜索 /* var ac = new BMap.Autocomplete( //建立一个自动完成的对象 {"input" : "sjbdz_lianxdz" ,"location" : map }); */ ac=new BMap.Autocomplete({ "input":"sjbdz_lianxdz", "location":map }); var c=document.getElementById("sjbdz_lianxdz").value; ac.setInputValue(c); } ac.addEventListener("onhighlight", function(e) { //鼠标放在下拉列表上的事件 var str = ""; var _value = e.fromitem.value; var value = ""; if (e.fromitem.index > -1) { value = _value.province + _value.city + _value.district + _value.street + _value.business; } str = "FromItem<br />index = " + e.fromitem.index + "<br />value = " + value; //value = ""; if (e.toitem.index > -1) { _value = e.toitem.value; value = _value.province + _value.city + _value.district + _value.street + _value.business; } str += "<br />ToItem<br />index = " + e.toitem.index + "<br />value = " + value; G("searchResultPanel").innerHTML = str; }); var myValue; ac.addEventListener("onconfirm", function(e) { //鼠标点击下拉列表后的事件 var _value = e.item.value; myValue = _value.province + _value.city + _value.district + _value.street + _value.business; G("searchResultPanel").innerHTML ="onconfirm<br />index = " + e.item.index + "<br />myValue = " + myValue; setPlace(); }); function setPlace(){ function myFun(){ var pp = local.getResults().getPoi(0).point; //获取第一个智能搜索的结果 map.centerAndZoom(pp, 18); map.addOverlay(new BMap.Marker(pp)); //添加标注 } var local = new BMap.LocalSearch(map, { //智能搜索 onSearchComplete: myFun }); local.search(myValue); }
