Wyłącz Ctrl + Przewiń, aby powiększyć mapy Google


97

Czy ktoś wie, jak wyłączyć CTRL+ Scroll?

Najpierw po przesunięciu kółka myszy mapa była powiększana / pomniejszana. Ale teraz prosi o naciśnięcie CTRL+ kółko myszy, aby powiększyć / pomniejszyć.

Jak możemy wyłączyć tę funkcję? Nie mogę znaleźć niczego w dokumentacji:

https://developers.google.com/maps/documentation/javascript/controls#ControlOptions

wprowadź opis obrazu tutaj



@BrajeshKanungo, który nie jest związany z powyższą funkcją - to nowa funkcja wprowadzona przez Google Maps - chcę ją wyłączyć.
Dawood Awan

Ok, czy możesz mi powiedzieć, której wersji API używasz.
Brajesh Kanungo


To właśnie pojawiło się również na naszej stronie, więc prawdopodobnie aktualizacja API googles
Tom

Odpowiedzi:


154

Musisz przejść gestureHandling: 'greedy'do opcji mapy.

Dokumentacja: https://developers.google.com/maps/documentation/javascript/interaction#gestureHandling

Na przykład:

const map = new google.maps.Map(mapElement, {
  center: { 0, 0 },
  zoom: 4,
  gestureHandling: 'greedy'
});

Aktualizacja! Ponieważ Google Maps 3.35.6, musisz zamknąć właściwość w opakowaniu opcji:

const map = new google.maps.Map(mapElement, {
  center: { 0, 0 },
  zoom: 4,
  options: {
    gestureHandling: 'greedy'
  }
});

Dziękuję ealfonsoza nowe informacje


@DiegoAndrade Nie znam szczegółów. może nie był wtedy zaimplementowany. Ale jest obecny w wersjach 3.29(frozen), 3.30(release) i nowszych ( 3.expeksperymentalnych).
kano

Tak, @Kano, w tych dokumentach ta funkcja jest nadal obecna, ale w moich testach tutaj nie działa. Naprawdę nie wiem, dlaczego to usunęli :(
Diego Andrade

1
Wiem, że jest obecny. O to chodzi. Zaczynając od 3.30To nie działa. Przetestowałem wszystkie te wersje. W każdym razie, to już działa z 3.26.
Diego Andrade,

3
wreszcie prawidłowa odpowiedź. Długo szukałem tego w Google. Dlaczego Google nie ustawił tego jako domyślnego, jest poza mną.
woens

2
Bingo, to idealne rozwiązanie.
N Khan

17

Jeśli możesz całkowicie wyłączyć przewijanie, aby powiększyć, możesz użyć scrollwheel: false. Użytkownik nadal będzie mógł powiększać mapę, klikając przyciski powiększenia, jeśli udostępnisz mu element sterujący powiększeniem ( zoomControl: true).

Dokumentacja: https://developers.google.com/maps/documentation/javascript/reference (wyszukaj na stronie „scrollwheel”)

const map = new google.maps.Map(mapElement, {
  center: { 0, 0 },
  zoom: 4,
  scrollwheel: false,
  zoomControl: true
});

7

Jeśli chcesz tylko ukryć nakładkę, ale nadal wyłączasz możliwość przewijania i powiększania (tak jak poprzednio), możesz użyć CSS, aby ukryć nakładkę:

.gm-style-pbc {
opacity: 0 !important;
}

Pamiętaj, że spowoduje to ukrycie mapy również na urządzeniach mobilnych, więc możesz użyć czegoś takiego, aby upewnić się, że pokazuje „użyj dwóch palców, aby przesunąć mapę”:

@media only screen and ( min-width: 980px ) {
.gm-style-pbc {
opacity: 0 !important;
}
}

Dziękuję Ci. Jestem zaskoczony, że więcej ludzi tego nie chce. To bardzo rozpraszający komunikat nakładki, który praktycznie niszczy dla mnie mapę.
BaseZen

5

Zagnieżdżanie gestureHandlingwe optionswłaściwości działało dla mnie w wersji "3.35.6".

map = new google.maps.Map(document.getElementById('map'), {
        zoom: 12,
        options:{
            gestureHandling: 'greedy'
        }
    });

4

Nie udało mi się gestureHandling: 'greedy'naprawić tej poprawki, ponieważ miałem nakładkę na mapę. Skończyło się na wykryciu mousewheelzdarzenia i ustawieniu ctrlwłaściwości na true.

// Load maps and attach event listener to scroll event.
var $map = $('.map');
$map[0].addEventListener('wheel', wheelEvent, true);         

function wheelEvent(event) {
    // Set the ctrlKey property to true to avoid having to press ctrl to zoom in/out.
    Object.defineProperty(event, 'ctrlKey', { value: true });
}
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.