api官网
http://developer.baidu.com/map/jshome.htm
例子代码(保存为静态页面html可见效果如下):
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="viewport" content="initial-scale=1.0, user-scalable=no" /><style type="text/css">body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;}</style><script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=42b8ececa9cd6fe72ae4cddd77c0da5d"></script><title>根据关键字本地搜索</title></head><body><div id="allmap"></div></body></html><script type="text/javascript">// 百度地图API功能var map = new BMap.Map("allmap"); // 创建Map实例map.centerAndZoom(new BMap.Point(116.404, 39.915), 11);window.openInfoWinFuns = null;var options = { onSearchComplete: function(results){ // 判断状态是否正确 if (local.getStatus() == BMAP_STATUS_SUCCESS){ var s = []; s.push('<div style="font-family: arial,sans-serif; border: 1px solid rgb(153, 153, 153); font-size: 12px;">'); s.push('<div style="background: none repeat scroll 0% 0% rgb(255, 255, 255);">'); s.push('<ol style="list-style: none outside none; padding: 0pt; margin: 0pt;">'); openInfoWinFuns = []; for (var i = 0; i < results.getCurrentNumPois(); i ++){ var marker = addMarker(results.getPoi(i).point,i); var openInfoWinFun = addInfoWindow(marker,results.getPoi(i),i); openInfoWinFuns.push(openInfoWinFun); // 默认打开第一标注的信息窗口 var selected = ""; if(i == 0){ selected = "background-color:#f0f0f0;"; openInfoWinFun(); } } }else{ $("#allmap").empty(); $("#allmap").append("检索没有结果，原因: " + result);} }};// 添加标注function addMarker(point, index){ 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); return marker;}// 添加信息窗口function addInfoWindow(marker,poi,index){ var maxLen = 10; var name = null; if(poi.type == BMAP_POI_TYPE_NORMAL){ name = "地址： " }else if(poi.type == BMAP_POI_TYPE_BUSSTOP){ name = "公交： " }else if(poi.type == BMAP_POI_TYPE_SUBSTOP){ name = "地铁： " } // infowindow的标题 var infoWindowTitle = '<div style="font-weight:bold;color:#CE5521;font-size:14px">'+poi.title+'</div>'; // infowindow的显示信息 var infoWindowHtml = []; infoWindowHtml.push('<table cellspacing="0" style="table-layout:fixed;width:100%;font:12px arial,simsun,sans-serif"><tbody>'); infoWindowHtml.push('<tr>'); infoWindowHtml.push('<td style="vertical-align:top;line-height:16px;width:38px;white-space:nowrap;word-break:keep-all">' + name + '</td>'); infoWindowHtml.push('<td style="vertical-align:top;line-height:16px">' + poi.address + poi.point.lng+','+poi.point.lat+' </td>'); infoWindowHtml.push('</tr>'); infoWindowHtml.push('</tbody></table>'); var infoWindow = new BMap.InfoWindow(infoWindowHtml.join(""),{title:infoWindowTitle,width:200}); var openInfoWinFun = function(){ marker.openInfoWindow(infoWindow); for(var cnt = 0; cnt < maxLen; cnt++){ if(!document.getElementById("list" + cnt)){continue;} if(cnt == index){ document.getElementById("list" + cnt).style.backgroundColor = "#f0f0f0"; }else{ document.getElementById("list" + cnt).style.backgroundColor = "#fff"; } } } marker.addEventListener("click", openInfoWinFun); return openInfoWinFun;}var local = new BMap.LocalSearch("成都", options);local.search("宽窄巷子");</script>
