jquery-ui-map cómo configurar el nivel de zoom

Tengo el siguiente código funcionando bien, pero no puedo agregar un nivel de acercamiento. De acuerdo con la docs que debería funcionar con 'option', 'zoom', 7 pero esto da un error: "$("#map_canvas").gmap("option", "zoom", 7).bind is not a function"jquery-ui-map cómo configurar el nivel de zoom

código de trabajo, sans zoom, editado. Zoom está siempre a 1.

$("#map_trigger").click(function(){ 
     var prop_id = $("#map_canvas").attr("rel"); 
     $('#map_canvas').gmap({'zoom':6}).bind('init', function(evt, map) { 
      $.getJSON(basepath+'properties/get_gps_coords/'+prop_id, function(data) { 
       $.each(data.markers, function(i, m) { 
        lat = m.latitude; 
        longitude = m.longitude; 
        $('#map_canvas').gmap(
         'addMarker', { 'position': new google.maps.LatLng(lat, m.longitude), 'bounds':true } 
        ); 
       }); 
      }); 
     }); 
    });

¿Cómo puedo añadir un nivel de zoom a este fragmento?

Fuente

2012-02-21 stef

Uso:

$("#map_canvas").gmap({'zoom':7})

La opción de método puede ser utilizado cuando el mapa ya está inicializado y no devolverá un jQuery a objetos, así que no es encadenables (lo que va a explicar el error que tienes).

Fuente

2012-02-21 10:33:17

Dónde? Intenté en varias ubicaciones, sin cambios – stef

en la 2.ª línea de tu código, antes de '.bind ('init',' –

Actualicé mi código arriba pero el zoom sigue siendo siempre como máximo – stef

Este código funciona para mí:

<!doctype html> 
<html> 
    <head> 
     <meta http-equiv="content-language" content="es"> 
     <meta charset="utf-8"> 

     <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> 
     <script type="text/javascript" src="js/jquery-1.7.1/jquery.min.js"></script> 
     <script type="text/javascript" src="../ui/jquery.ui.map.js"></script> 

    </head> 
    <body> 
     <div style="height: 500px; width:500px;" id="map_canvas"></div> 
     <button id="btnChangeZoom">change zoom</button> 
     <script type="text/javascript"> 
     $(function() { 
      $('#map_canvas').gmap({ 'center': '40.33238,-3.76546','scrollwheel':false}); 
      $('#map_canvas').gmap('option', 'mapTypeId', google.maps.MapTypeId.SATELLITE); 
      $('#map_canvas').gmap('option', 'zoom', 17); 
      }); 

     $("#btnChangeZoom").click(function(){changeZoom()}); 

     function changeZoom(){ 
      $('#map_canvas').gmap('option', 'zoom', 10); 
     } 
     </script> 
    </body> 
</html>

Fuente

2012-02-21 11:01:28 jcalonso

Yo deba centrar el mapa y luego ampliarla. Aquí hay una muestra del código

$('#map_canvas').gmap({'center': '43.1502, 25.02083'}) 
$('#map_canvas').gmap('option', 'zoom', 10); 
$('#map_canvas').gmap('addMarker', {'position': '43.1502, 25.02083', 'icon': '/picnic/img/Pin.png'}).click(function() { 
    //$('#map_canvas').gmap('openInfoWindow', {'content': 'Hello World!'}, this); 
});

Fuente

2014-05-31 10:55:38

jquery-ui-map cómo configurar el nivel de zoom

Respuesta

Cuestiones relacionadas