0

クラスター マーカーの例を使用して、データベースの地理座標を使用するマップを作成しました。を使用して自動的にズームするようにしましたLatLngBounds();

 <script type="text/javascript">
     function initialize() {
            var center = new google.maps.LatLng(9.4419, 9.1419);

            var map = new google.maps.Map(document.getElementById('map'), {
              zoom: 2,
              center: center,
              mapTypeId: google.maps.MapTypeId.ROADMAP
            });

            var markers = [];
            // create the infowindow out of the for boucle
            var infoWindow = new google.maps.InfoWindow;
            var bounds = new google.maps.LatLngBounds();

for ( var i = 0; i < latlng.length; i++ ) {

      var latLng = new google.maps.LatLng(latlng.lat,latlng.lng);   

     var html = 'test show in infowondow';

    var marker = new google.maps.Marker({
            position: latLng,
            map: map,
            icon:"/img/icon1.jpg",
            title:"test title",
        });
    // call to the function....
    bindInfoWindow(marker, map, infoWindow, html);
    markers.push(marker);

  }     

            var markerCluster = new MarkerClusterer(map, markers);
          }

    // create a function bindInfoWindow

    function bindInfoWindow(marker, map, infoWindow, html) {
          google.maps.event.addListener(marker, 'click', function() {
            infoWindow.setContent(html);
            infoWindow.open(map, marker);
          });
    }

            var markerCluster = new MarkerClusterer(map, markers);
          }
          google.maps.event.addDomListener(window, 'load', initialize);
        </script>
4

1 に答える 1

1
  • 境界をグローバルにします。
  • 後で

var latLng = new google.maps.LatLng(latlng.lat,latlng.lng);

編集:そしてマルセロが指摘したように、これを次のように変更します:

var latLng = new google.maps.LatLng(latlng[i].lat,latlng[i].lng);

追加:

bounds.extend(latLng)

var markerCluster = new MarkerClusterer(map, markers);

追加:

map.fitBounds(bounds);

于 2012-07-03T12:29:23.167 に答える