2012-07-12 7 views
45

Aquí está el código que he escrito para agregar un marcador al mapa de Google proporcionando latitud y longitud. El problema es que obtengo un mapa de google muy ampliado. Intenté configurar el nivel de zoom en 1, pero esto no tiene efecto en el mapa con un zoom muy alto.Cómo establecer el nivel de zoom en el mapa de 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> 

¿Cómo puedo disminuir el nivel de zoom para este caso?

Respuesta

82

Su código de abajo está el zoom el mapa para ajustarse a los límites especificados:

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

Si solo tiene 1 marcador y lo agrega a los límites, lo que resulta en el zoom más estrecha posible:

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

Si se mantiene un registro del número de marcadores que ha "añadido" para el mapa (o ampliados los límites con), sólo se puede llamar fitBounds si ese número es mayor que uno. Usualmente presiono los marcadores en una matriz (para uso posterior) y pruebo la longitud de esa matriz.

Si solo tiene un marcador, no use fitBounds. Llame al setCenter, setZoom con la posición del marcador y su nivel de zoom deseado.

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

sólo tengo una marcador, entonces quiero decre Ase el nivel de zoom, ¿me puede ayudar a modificar el código anterior? gracias por su ayuda – rockstar

+0

modificó la respuesta para abordar el solo caso de marcador – geocodezip

5

Aquí es una función que utilizo:

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

Para acercar su nivel de mapa de dos a continuación, sólo tiene que añadir este pequeño código de la línea map.setZoom(map.getZoom() + 2);

5

Lo que estamos buscando son las escalas para cada nivel de zoom. Utilice éstos:

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: 36.978.596,910000

4: 73.957.193,820000

3: 147914387,600000

2: 295828775,300000

1: 591657550,500000

+5

En pies ot en metros? –

Cuestiones relacionadas