Можно ли отключить ScrollWheel в пользовательском режиме просмотра улиц? - PullRequest
Новая
       37

Можно ли отключить ScrollWheel в пользовательском режиме просмотра улиц?

6 голосов
/ 28 июля 2010

Я создаю сайт, и у меня есть страница, которая берет адрес и использует его для создания google-карты в стиле 2D-карты, а затем рядом с ней вид улицы для этого адреса.

Моя проблемазаключается в том, что эти две карты охватывают почти всю ширину сайта, и пользователь, скорее всего, заставит свою мышь навести на нее курсор при прокрутке страницы и запутаться из-за невозможности прокрутить ее вниз (при увеличении карты).

Отключение этого для 2D-карты было довольно прямолинейно 

    //works to disable scroll wheel in 2D map   
var mapOptions = {
  zoom: 12,
  center: latlng,
  scrollwheel: false,
  mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions );

//not working to disable scroll wheel in panorama
var panoramaOptions = {
  position: results[0].geometry.location,
  scrollwheel: false
};

panorama = new  google.maps.StreetViewPanorama(document.getElementById("map_canvas2"), panoramaOptions );

, но просмотр улиц не позволяет мне отключить колесо прокрутки с помощью этих параметров, и я не могу найти эту проблемуадресовано в гугл-документах.Кто-нибудь знает, МОЖЕТ ли это быть сделано или предложения о том, как к нему подойти?

Ответы [ 5 ]

10 голосов
/ 20 апреля 2011

Был запрос функции с Gmaps API v3, чтобы добавить scrollwheel: false к просмотру улиц http://code.google.com/p/gmaps-api-issues/issues/detail?id=2557. Теперь это исправлено, просто используйте scrollwheel: false в ваших StreetViewPanorama вариантах.

3 голосов
/ 11 октября 2010

У меня такая же проблема, когда пользователь прокручивает колесо мыши вниз, курсор попадает в вид улицы Google и начинает масштабировать вместо прокрутки вниз страницы.

В Google Maps они предоставляютсвойство scrollwheel, которое может отключить это, но, к сожалению, это, кажется, не реализовано в режиме просмотра улиц.

Единственный обходной путь, который я нашел на данный момент, - это, как сказал @bennedich в предыдущем ответе, я поместил пустой /Прозрачный div точно для просмотра улиц div.

Я включаю элементы управления, когда пользователь щелкает мышью в любом месте области просмотра улиц, используя jQuery, чтобы скрыть этот пустой div (используя свойство видимости css) в событии mousedown и когдапользователь выводит свою мышь, я помещаю этот пустой div обратно.Это означает, что каждый раз, когда пользователь хочет взаимодействовать с элементом управления просмотром улиц, он должен щелкнуть его один раз.Это не лучшее решение, но лучше, чем ловить мышь при прокрутке

0 голосов
/ 05 мая 2018

Мое решение было следующим. Как только мышь прокручивается на виде улицы с помощью события «wheel», сделайте прокрутку искусственно и перенесите оверлей на передний план. 

$('.streetViewOverlay').click(function(e) {
   $(this).addClass('streetViewOverlayClicked');
});

document.querySelector('#street-view').addEventListener("wheel", function(evt) {
    $(document).scrollTop($(document).scrollTop() + evt.deltaY);
    $('.streetViewOverlay').removeClass('streetViewOverlayClicked');
});



$('#street-view').mouseleave(function() {
    $('.streetViewOverlay').removeClass('streetViewOverlayClicked');
});


var panorama;
  function initialize() {
    panorama = new google.maps.StreetViewPanorama(
        document.getElementById('street-view'),
        {
          position: {lat: 37.869260, lng: -122.254811},
          pov: {heading: 165, pitch: 0},
          zoom: 1,
          gestureHandling: 'cooperative',
           scrollwheel: false
        });
  }

.streetViewOverlay {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    opacity: 0;
}

.streetViewOverlayClicked {
    z-index: 1;
}
0 голосов
/ 24 ноября 2016

Существует исправление от Google для решения этой проблемы.

Исправление, которое работает на данный момент, состоит в том, чтобы явно установить номер версии в 3,25 для scrollwheel: false для работы.

Пример: https://maps.googleapis.com/maps/api/js?key=XXX&v=3.25

0 голосов
/ 28 июля 2010

Не знаю о способе javascript, но с помощью html и css вы можете поместить невидимый div с более высоким z-index на карту / вид улицы.

...