2011-11-20 18 views
41

Chcę dodać kody wewnątrz funkcji wyłączania(), aby wyłączyć przeciąganie i powiększanie w Google Maps API v3, klikając przycisk "wyłącz".wyłączyć powiększanie przeciągając w Google mapy, klikając przycisk

<script type="text/javascript"> 
    var map; 

    function initialize() { 
var uluru = new google.maps.LatLng(21, 57); 
map = new google.maps.Map(document.getElementById("map"), { 
    zoom: 6, 
    center: uluru, 
    mapTypeId: google.maps.MapTypeId.HYBRID 
}); 
} 


function disable(){ 

} 

</script> 


<body onload="initialize()" > 

    <input type="button" id="next" value="disableZoomDrag" onclick="disable()"> 

</body> 

Odpowiedz

117

Można użyć metody setOptions() na obiekcie mapy:

map.setOptions({draggable: false, zoomControl: false, scrollwheel: false, disableDoubleClickZoom: true}); 

Jeśli to nie przeszkadza powiększanie, zawsze można ustawić minimalny i maksymalny zoom do bieżącego poziomu powiększenia.

Istnieje również opcja disableDefaultUI, która prawdopodobnie bierze pod uwagę wszystkie te zdarzenia, ale może wyłączyć klikanie istniejących elementów.

+0

dziękuję bardzo. ty r awesome ^^ –

+0

Po prostu notatka, możesz również dodać je podczas inicjowania nowej instancji obiektu mapy: 'var map = new google.maps.Map (mapElement, mapOptions);' gdzie 'mapOptions' będzie twoimi opcjami : 'var mapOptions = {przeciągane: false, zoomControl: false, scrollwheel: false, disableDoubleClickZoom: true};' –

2

@ Odpowiedź Scotta wskazała mi właściwy kierunek używania map.setOptions(). Jednak z wersji API documentation odkryłem, że istnieje bardziej elegancki zestaw opcji do ustawienia. Być może są one nowsze niż odpowiedź, ale działają dla mnie całkiem dobrze.

function disablePanningAndScrolling() 
{ 
    map.setOptions({ 
     zoomControl: false, 
     gestureHandling: 'none' 
    }); 
} 

To całkowicie wyłącza powiększanie i przesuwanie.

Aby powrócić do normalnego stanu rzeczy, po prostu ustawić właściwości z powrotem do wartości domyślnych:

function enablePanningAndScrolling() 
{ 
    map.setOptions({ 
     zoomControl: true, 
     gestureHandling: 'greedy' // or 'cooperative'* 
    }); 
} 

*: domyślnie jest chciwy, jeśli strona nie jest przewijana, spółdzielni, kiedy to jest. Wybierz dowolną sytuację w aplikacji.

Powiązane problemy