百度地图api基本用法和一些demo[根据地址查询经纬度,并进行动态标注BMap.Marker地点]

百度地图生成器：[可以自动生成一个简单百度地图]*****************

http://api.map.baidu.com/lbsapi/creatmap/

-----------------------------------------------------------------------------------------------------

百度地图api示例：[官方：各种效果]----LBS开放平台*************
http://developer.baidu.com/map/jsdemo.htm#a1_2
----------------------------------------------------------------------------------------------------
百度地图api的使用方法：[个人博客，可以参考]
http://www.cnblogs.com/xuhongfei/archive/2013/04/10/3011964.html
----------------------------------------------------------------------------------------------------
1、百度地图BMap API的应用实例************************************
自定义标注、精确和模糊查询、个性化添加、右键菜单等

http://blog.csdn.net/ithomer/article/details/6606258

2、如何在网页中调用百度地图API[csdn个人博客]
问题：【百度地图API】建立全国银行位置查询系统（一）——如何创建地图
http://blog.csdn.net/b_h_l/article/details/8261694
----------------------------------------------------------------------------------------------------
百度地图api如何添加到网站中
将你的代码添加到相对应的地方或者单元格里，通常在单元格的<td>　</td>中间添加就可以啦。例如<td><script type="text/javascript" src=" http://api.map.baidu.com/api?key=***&v=1.0&services=true" ></script></td>
----------------------------------------------------------------------------------------------------
根据地址查询经纬度【简单实用】##################################
http://www.cnblogs.com/jianglan/archive/2013/05/31/3108646.html

百度地图API学习总结

http://blog.csdn.net/xiazdong/article/details/7381142

----------------------------------------------------------------------------------------------------

应用例子demo：

使用的js：

<script type="text/javascript" src="js/jquery.min.js"> </script>
<script type="text/javascript"
src="http://api.map.baidu.com/api?v=2.0&ak=zhoLwfGn0l5jsE5W5NUyodjy&services=true"></script>
<script type="text/javascript">
$(document).ready(function () { 
   var map = new BMap.Map("container");
   //城市
   //var city=$("#areaName").val();
   
    $("#search").change(function(){  
var city=$("#search").val();
var centerShop=$("#search").find("option:selected").text();
   
   
   map.centerAndZoom(city, 15);
   map.enableScrollWheelZoom();    //启用滚轮放大缩小，默认禁用
   map.enableContinuousZoom();    //启用地图惯性拖拽，默认禁用

   map.addControl(new BMap.NavigationControl());  //添加默认缩放平移控件
   map.addControl(new BMap.OverviewMapControl()); //添加默认缩略地图控件
   map.addControl(new BMap.OverviewMapControl({ isOpen: false, anchor: BMAP_ANCHOR_BOTTOM_RIGHT }));   //右下角，打开


    var localSearch = new BMap.LocalSearch(map);
    localSearch.enableAutoViewport(); //允许自动调节窗体大小
   
   
    var count = 0;
   
(function searchByStationName() {
   //map.clearOverlays();//清空原来的标注
   //定位的地址
   //var keyword=$("#address").html().replace("\-","");
   var keyword=city.replace("\-","");
   //网点名称
   //var branchName=$("#branchName").html();
   var branchName=centerShop;
   //联系方式
   //var branchPhone=$("#branchPhone").html();
var branchPhone="6654323";
var poi;
debugger;
   localSearch.setSearchCompleteCallback(function (searchResult) {
      map.clearOverlays();//*****清空原来的标注,每次回调搜索的时候，清空标注*****
       poi = searchResult.getPoi(0);  
       if(!poi){
      if(count==0) {
         localSearch.search(keyword.replace(/^(.*?号).*$/g,"$1"));
         count++;
        }
      else if(count==1){
         localSearch.search(keyword.replace(/^(.*?)号.*$/g,"$1"));
         count++;
        }
      else if(count==2){
         localSearch.search(keyword.replace(/^(.*?路).*$/g,"$1"));
         count++;
        }
      else if(count==3){
         localSearch.search(keyword.replace(/^(.*?区).*$/g,"$1"));
         count++;
        }
      else if(count==4){
         localSearch.search(keyword.replace(/^(.*?市).*$/g,"$1"));
         count++;
        }
      else if(count==5){
         localSearch.search(keyword.replace(/^(.*?省).*$/g,"$1"));
         count++;
        }
        return;
    }
    //else{
    //count--;
  //  }
       map.centerAndZoom(poi.point, 15);
       var marker = new BMap.Marker(new BMap.Point(poi.point.lng, poi.point.lat));  // 创建标注，为要查询的地方对应的经纬度
       map.addOverlay(marker);
       if(null==branchPhone){
        var content ="<div style='font-size:12px;'>"+"<div style='text-align:center;font-weight:bold;'>"+branchName+ "</div><br/>联系方式：" +"暂无联系方式"+ "<br/>网点地址：" + keyword+"</div>";        
       }
       if(null!==branchPhone){
        var content ="<div style='font-size:12px;'>"+"<div style='text-align:center;font-weight:bold;'>"+branchName+ "</div><br/>联系方式：" + branchPhone+ "<br/>网点地址：" + keyword+"</div>";        
       }
       var opts = {
        enableMessage:false,
         width : 250,     // 信息窗口宽度
         height: 90,     // 信息窗口高度
       //  title :branchName,  // 信息窗口标题
        }
       var infoWindow = new BMap.InfoWindow(content ,opts);
       marker.addEventListener("mouseover", function () { this.openInfoWindow(infoWindow); });
       marker.openInfoWindow(infoWindow);
      // marker.setAnimation(BMAP_ANIMATION_BOUNCE); //跳动的动画
   });
localSearch.search(keyword);
} )();

});
});
</script>

jsp页面：

<table align="center" border=1 bordercolor="red"
style="width: 697px; height: 550px; border: purple solid 1px;">
<tr>
<td id="container"
style="width: 697px; height: 550px; border: #ccc solid 1px;"></td>
<td>
搜索：
<select id="search" name="searchCity">
<option value="上海浦东机场迎宾大道6000号候机楼" selected="selected">
浦东机场营业部
</option>
<option value="上海市浦东新区芳甸路1201号一层108室">
新国际展览中心兑换网点
</option>
<option value="上海市黄浦区文昌路8号一层-A室">
豫园文昌店
</option>
</select>


</td>
</tr>
</table>

页面展示效果：