百度地圖jsapi

項目需求：根據客戶所在城市顯示體檢機構。
首先要定位到客戶所在城市，然後把此城市的所有體檢機構顯示出來供用戶選擇。
過程中遇到的問題，百度不到，但是慢慢的就解決了，比如初始化後地圖的中心點並不在屏幕的中心，批量地址解析行不通等。

1.申請百度ak

<script src="http://api.map.baidu.com/api?v=2.0&ak=PeBUf5626HGDsEWw2Hk8e6sw6TrsRv32"></script>

2.創建地圖實例，初始化地圖

var map = new BMap.Map("container");// 創建地圖實例  
var point = new BMap.Point(116.404, 39.915);// 創建點座標  
map.centerAndZoom(point, 11);// 初始化地圖，設置中心點座標和地圖級別  

3.將後臺傳的城市轉化爲百度地圖識別的經緯度point實例（地址解析）

var myGeo = new BMap.Geocoder();
    // 將地址解析結果顯示在地圖上,並調整地圖視野
    myGeo.getPoint("北京市海淀區上地10街", function(point){
        if (point) {
            map.centerAndZoom(point, 16);
            map.addOverlay(new BMap.Marker(point));
        }else{
            alert("您選擇地址沒有解析到結果!");
        }
    }, "北京市");             

4.將多個後臺傳過來的機構轉化爲經緯度標註在地圖上（批量地址解析）

var map = new BMap.Map("l-map");
    map.centerAndZoom(new BMap.Point(117.269945,31.86713), 13);
    map.enableScrollWheelZoom(true);
    var index = 0;
    var myGeo = new BMap.Geocoder();
    var adds = [
        "包河區金寨路1號（金寨路與望江西路交叉口）",
        "廬陽區鳳台路209號（鳳台路與蒙城北路交叉口）",
        "蜀山區金寨路217號(近安醫附院公交車站)",
        "蜀山區梅山路10號(近安徽飯店) ",
        "蜀山區 長豐南路159號銅鑼灣廣場312室",
        "合肥市壽春路93號錢櫃星樂町KTV（逍遙津公園對面）",
        "廬陽區長江中路177號",
        "新站區勝利路89"
    ];
    function bdGEO(){
        var add = adds[index];
        geocodeSearch(add);
        index++;
    }
    function geocodeSearch(add){
        if(index < adds.length){
            setTimeout(window.bdGEO,400);
        } 
        myGeo.getPoint(add, function(point){
            if (point) {
                document.getElementById("result").innerHTML +=  index + "、" + add + ":" + point.lng + "," + point.lat + "</br>";
                var address = new BMap.Point(point.lng, point.lat);
                addMarker(address,new BMap.Label(index+":"+add,{offset:new BMap.Size(20,-10)}));
            }
        }, "合肥市");
    }
    // 編寫自定義函數,創建標註
    function addMarker(point,label){
        var marker = new BMap.Marker(point);
        map.addOverlay(marker);
        marker.setLabel(label);
    }

5.項目代碼

var height =  document.body.clientHeight;
      $('.box').height(height-54);
      var map = new BMap.Map("container");// 創建地圖實例  
      var point = new BMap.Point(116.404, 39.915);// 創建點座標  
      map.centerAndZoom(point, 11);// 初始化地圖，設置中心點座標和地圖級別  

      //設置屏幕中心點爲point
      // var loadCount = 1;  
      // map.addEventListener("tilesloaded",function(){  
      //     if(loadCount == 1){  
      //         map.setCenter(point);  
      //     }         
      //         loadCount = loadCount + 1;  
      // });  
      //添加控件
      map.addControl(new BMap.NavigationControl());    
      map.addControl(new BMap.ScaleControl());    
      map.addControl(new BMap.OverviewMapControl());
      //默認進入的城市
      getMedical('北京');
     //獲取當前城市的醫院
     function getMedical(newCity){
      $.ajax({
          type: 'POST',
          url: '/schedule/getInfo',
          data:{city:newCity},
          dataType: "json",
          success: function(data){
              $('.cover').hide();
              $('.mapImg').hide();
              var medical = [];
              var addr = [];
              var phone = [];
              for(var i=0;i<data.length;i++){
                medical.push(data[i].title);
                addr.push(data[i].addr);
                phone.push(data[i].phone);
              }
              //將城市轉化爲經緯度並且將地圖中心點移到此城市
              var cityGeo = new BMap.Geocoder();
              cityGeo.getPoint(newCity,function(point){
                if(point){
                  map.setCenter(point);
                }
              }, newCity);
              //將指定城市的醫院轉化爲經緯度並標註
              var medicalGeo = new BMap.Geocoder();
              var index = 0;
              function bdGEO(){
                  var add = medical[index];
                  var addAddr = addr[index];
                  var addPhone = phone[index];
                  geocodeSearch(add,addAddr,addPhone);
                  index++;
              }
              function geocodeSearch(add,addAddr,addPhone){
                if(index <= medical.length){
                  setTimeout(bdGEO,200);
                } 
                medicalGeo.getPoint(add, function(point){
                  if (point) {
                    addMarker(point, index,add,addAddr,addPhone);
                  }
                }, newCity);
              }
              function addMarker(point, index,add,addAddr,addPhone){  // 創建圖標對象   
                var myIcon = new BMap.Icon("/public/dist/images/marker2.png", new BMap.Size(34, 94), {       
                });      
                // 創建標註對象並添加到地圖   
                var marker = new BMap.Marker(point, {icon: myIcon});    
                map.addOverlay(marker);     
                marker.addEventListener("click", function(){   
                    var tapTitle = '<a  href="/schedule/home" style="font-size:.75rem;">'+add+'</a>'; 
                    var tapCont = '<p style="margin:.5rem 0;font-size: .7rem;">'+addAddr+' &nbsp; '+addPhone;
                    var opts = {    
                        width : 180,     //信息窗口寬度    
                        height: 90,     //信息窗口高度    
                        title : tapTitle  //信息窗口標題   
                    }    
                    var infoWindow = new BMap.InfoWindow(tapCont, opts);//創建信息窗口對象    
                    map.openInfoWindow(infoWindow, point);//打開信息窗口   
                });
              } 
              bdGEO();
          }
      });
    }