2011-12-29 2 views
2

У меня возникла проблема при попытке использовать Google Maps api v3 (с маркерным кластером) на моем веб-сайте. Это выход я имею на данный момент:Google maps 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)

спасибо за все заранее!

+0

Я МАМЫ не в состоянии видеть изображение. – Unknown

+0

Я отправил ссылку сейчас, извините. никогда не использовал изображения до этого –

ответ

1

Вы пробовали использовать $ .goMap? Это отличный JQuery плагин, и это имеет очень простой метод для маркеров кластеризации:

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

+0

спасибо, но я на самом деле «решил» его, это был только мой вопрос с браузером –

Смежные вопросы