2012-07-12 14 views
45

Oto kod, który napisałem, aby dodać znacznik do mapy google, podając szerokość i długość geograficzną. Problem polega na tym, że dostaję bardzo mocno powiększoną mapę google. Próbowałem ustawić poziom powiększenia na 1, ale nie ma to wpływu na bardzo dużą mapę.Jak ustawić poziom powiększenia w mapie google

<script src="http://maps.google.com/maps/api/js?v=3&sensor=false" type="text/javascript"></script> 
    <script type="text/javascript"> 
     var icon = new google.maps.MarkerImage("http://maps.google.com/mapfiles/ms/micons/blue.png",new google.maps.Size(32, 32), new google.maps.Point(0, 0),new google.maps.Point(16, 32)); 
     var center = null; 
     var map = null; 
     var currentPopup; 
     var bounds = new google.maps.LatLngBounds(); 
     function addMarker(lat, lng, info) { 
      var pt = new google.maps.LatLng(lat, lng); 
      bounds.extend(pt); 
      var marker = new google.maps.Marker({ 
       position: pt, 
       icon: icon, 
       map: map 
      }); 
      var popup = new google.maps.InfoWindow({ 
       content: info, 
       maxWidth: 300 
      }); 
      google.maps.event.addListener(marker, "click", function() { 
       if (currentPopup != null) { 
        currentPopup.close(); 
        currentPopup = null; 
       } 
       popup.open(map, marker); 
       currentPopup = popup; 
      }); 
      google.maps.event.addListener(popup, "closeclick", function() { 
       map.panTo(center); 
       currentPopup = null; 
      }); 
     } 
     function initMap() { 
      map = new google.maps.Map(document.getElementById("map"), { 
      center: new google.maps.LatLng(0, 0), 
      zoom: 1, 
      mapTypeId: google.maps.MapTypeId.ROADMAP, 
      mapTypeControl: false, 
      mapTypeControlOptions: { 
       style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR 
      }, 
      navigationControl: true, 
      navigationControlOptions: { 
       style: google.maps.NavigationControlStyle.SMALL 
      } 
     }); 
     addMarker(27.703402,85.311668,'New Road'); 
     center = bounds.getCenter(); 
     map.fitBounds(bounds); 

     } 
</script> 
</head> 
<body onload="initMap()" style="margin:0px; border:0px; padding:0px;"> 
<div id="map"></div> 
</body> 
</html> 

Jak mogę zmniejszyć poziom powiększenia w tym przypadku?

Odpowiedz

82

Kod poniżej jest powiększanie mapy, aby pasowały do ​​określonych granic:

addMarker(27.703402,85.311668,'New Road'); 
center = bounds.getCenter(); 
map.fitBounds(bounds); 

Jeśli tylko 1 znacznik i dodać go do granic, które skutkuje najbliższy możliwy zoom:

function addMarker(lat, lng, info) { 
    var pt = new google.maps.LatLng(lat, lng); 
    bounds.extend(pt); 
} 

Jeśli śledzić liczbę markerów masz „dodany” na mapie (lub rozszerzył granice z), można tylko nazwać fitBounds jeśli liczba ta jest większa niż jeden. Zazwyczaj wciskam znaczniki do tablicy (do późniejszego użycia) i testuję długość tej tablicy.

Jeśli będziesz mieć tylko jeden znacznik, nie używaj funkcji fitBounds. Zadzwoń pod numer setCenter, setZoom za pomocą pozycji znacznika i żądanego poziomu powiększenia.

function addMarker(lat, lng, info) { 
    var pt = new google.maps.LatLng(lat, lng); 
    map.setCenter(pt); 
    map.setZoom(your desired zoom); 
} 
+1

i tylko jeden znacznik, więc chcę zmniejszyć na poziomie powiększenia, czy możesz mi pomóc zmienić powyższy kod? dzięki za pomoc – rockstar

+0

zmodyfikowałeś odpowiedź na adres pojedynczego markera – geocodezip

5

Oto funkcja używam:

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

function zoomTo(level) { 
     google.maps.event.addListener(map, 'zoom_changed', function() { 
      zoomChangeBoundsListener = google.maps.event.addListener(map, 'bounds_changed', function (event) { 
       if (this.getZoom() > level && this.initialZoom == true) { 
        this.setZoom(level); 
        this.initialZoom = false; 
       } 
       google.maps.event.removeListener(zoomChangeBoundsListener); 
      }); 
     }); 
    } 
9

do powiększania poziomu mapa dwa a potem po prostu dodać ten mały kod linii map.setZoom(map.getZoom() + 2);

5

Co szukasz są wagi dla każdego poziomu powiększenia. Używać tych:

20: 1128,497220

19: 2256.994440

18: 4513.988880

17: 9027.977761

16: 18055.955520

15: 36111,911040

14 : 72223.822090

13: 144447,644200

12: 288895,288400

11: 577790,576700

10: 1155581,153000

9: 2311162,307000

8: 4622324,614000

7: 9244649.227000

6: +18.489.298,450000

5: 36978596,910000

4: 73957193,820000

3: +147.914.387,600000

2: 295828775,300000

1: 591657550,500000

+5

W stopach w metrach? –

Powiązane problemy