Google maps api v3 + marker clusterer：centering map？

Question

我在嘗試在我的網站上使用Google地圖API v3（帶標記羣集器）時遇到問題。這是我在這一點上具有輸出：

http://imageshack.us/photo/my-images/710/mapproblem.png/

編輯：我第一次使用的圖片在後，我似乎無法能夠直接發佈，所以我貼鏈接代替。對於那個很抱歉。

你可以看到，有一個在所有

沒有對準這是代碼的顯著部分：

show_map.js

function showMap(json_items) { 

     var geocoder = new google.maps.Geocoder(); 
     var latlng; 
     geocoder.geocode({'address':json_items[0]}, function(results,status){ 
      latlng = new google.maps.LatLng(results[0].geometry.location.lat(), results[0].geometry.location.lng()); 
     }); 

     var markers = [] 
     var markoptions = { 
      maxZoom : 10, 
      gridSize : 50 
     } 
     var bounded = new google.maps.LatLngBounds(); 

     var options = { 
      'mapTypeId': google.maps.MapTypeId.ROADMAP, 
      'center': latlng 
     }; 

     var map = new google.maps.Map(document.getElementById("big_map"), options); 
     if(document.getElementById("big_map")){ 

      for (var i=1; i<10; i++){ 
       geocoder.geocode({'address': json_items[i]}, function(results, status){ 
        var marker = new google.maps.Marker({position: results[0].geometry.location, map:map}); 
        markers.push(marker); 

       }); 
       bounded.extend(results[0].geometry.location); 
       map.fitBounds(bounded); 

      } 

      var markerCluster = new MarkerClusterer(map, markers, markoptions); 
      //map.fitBounds(markerCluster.getExtendedBounds(bounded)); 
     } 
} 

的main.css

/*Big google map*/ 
#big-map { 
    border: solid 1px #afafaf; 
    background: #fff; 
    margin-bottom: 15px; 
    display: none; 
} 

#big-map .title { 
    border-bottom: solid 1px #afafaf; 
    background: #ebebeb; 
    height: 32px; 
    line-height: 32px; 
    font-size: 14px; 
    font-weight: bold; 
    margin: 0; 
    padding: 0 10px; 
} 

#big-map #big_map { 
     padding: 0; 
     margin: 0; 
     position: relative; 
     z-index: 3; 
     width: 948px; 
     height: 280px; 
} 

，最後是模板：

<div class="grid_24"> 
     <div id="big-map"> 
      <h2 class="title">Map</h2> 
      <div id="big_map"></div> <!-- this is where the actual map should spanw --> 
      <a class="link" href="#">Reduce map</a> 
     </div> 
     <div class="clear"></div>  
</div> 
<div class="clear"></div> 

我真的不知道我該在哪裏檢查錯誤/錯誤的風格和東西。繼參考頁面和教程後，我似乎正在做的一切正確（我不知道markerclusterer和latlngbounds，tho之間最終衝突）

謝謝所有提前！

Answer 1

您是否嘗試過使用$ .goMap？這是一個偉大的jQuery插件，並有標記的聚類一個非常簡單的方法：

http://www.pittss.lv/jquery/gomap/solutions/markerclusterer.html