SORU
30 Mart 2013, CUMARTESİ


Google Maps API v3: otomatik-merkezi çoklu işaretleri ile göster

Bu 3 pin/işaretleri ile bir harita göstermek için kullanılır:

    <script> 
      function initialize() {
    var locations = [
      ['DESCRIPTION', 41.926979,12.517385, 3],
      ['DESCRIPTION', 41.914873,12.506486, 2],
      ['DESCRIPTION', 41.918574,12.507201, 1]
    ];

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

    var infowindow = new google.maps.InfoWindow();

    var marker, i;

    for (i = 0; i < locations.length; i  ) {  
      marker = new google.maps.Marker({
        position: new google.maps.LatLng(locations[i][1], locations[i][2]),
        map: map
      });

      google.maps.event.addListener(marker, 'click', (function(marker, i) {
        return function() {
          infowindow.setContent(locations[i][0]);
          infowindow.open(map, marker);
        }
      })(marker, i));
    }
      }

      function loadScript() {
        var script = document.createElement('script');
        script.type = 'text/javascript';
        script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false&'   'callback=initialize';
        document.body.appendChild(script);
      }

      window.onload = loadScript;
    </script>

<div id="map" style="width: 900px; height: 700px;"></div>

Aradığım şey "" haritanın ortasında bulmak center: new google.elle önlemek için bir yoldur haritalar.LatLng(41.923, 12.513). Bir şekilde otomatik olarak harita 3 koordinatları üzerinde yoğunlaştı.

CEVAP
30 Mart 2013, CUMARTESİ


Daha kolay bir yol, LatLngBounds boş bir yerine uzanan bir açıkça iki noktadan oluşturarak var. (Daha fazla ayrıntı için this question)

Bakmak lazım böyle bir şey, kodunuz eklendi:

//create empty LatLngBounds object
var bounds = new google.maps.LatLngBounds();
var infowindow = new google.maps.InfoWindow();    

for (i = 0; i < locations.length; i  ) {  
  var marker = new google.maps.Marker({
    position: new google.maps.LatLng(locations[i][1], locations[i][2]),
    map: map
  });

  //extend the bounds to include each marker's position
  bounds.extend(marker.position);

  google.maps.event.addListener(marker, 'click', (function(marker, i) {
    return function() {
      infowindow.setContent(locations[i][0]);
      infowindow.open(map, marker);
    }
  })(marker, i));
}

//now fit the map to the newly inclusive bounds
map.fitBounds(bounds);

//(optional) restore the zoom level after the map is done scaling
var listener = google.maps.event.addListener(map, "idle", function () {
    map.setZoom(3);
    google.maps.event.removeListener(listener);
});

Bu şekilde, puan için rastgele bir sayı kullanabilirsiniz, ve sırasını önceden bilmesine gerek yok.

JsFiddle Demo burada: http://jsfiddle.net/x5R63/

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • ASUS North America

    ASUS North A

    12 AĞUSTOS 2008
  • Khan Academy

    Khan Academy

    17 Kasım 2006
  • megablueblaster

    megablueblas

    23 HAZİRAN 2006