Javascript 可以在自定义街道视图中禁用滚轮吗？

我正在建立一个网站，我有一个网页，上面有一个地址，并用它生成一个二维路线图风格的谷歌地图，然后在它旁边，是该地址的街景

我的问题是，这两张地图几乎覆盖了网站的整个宽度，用户在向下滚动页面时，很可能会将鼠标放在上面，并因无法向下滚动（放大地图时）而感到困惑

在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 );

---

但是街景似乎不允许我使用这些选项禁用滚轮，我无法在谷歌文档中找到这个问题。有人知道这是否可以实现或如何实现吗？

不知道javascript的方式，但使用html和css，您可以在地图/街景上放置一个z索引更高的不可见div。

我也有同样的问题，当用户使用鼠标滚轮向下滚动时，光标在谷歌街景中被捕捉，并开始缩放而不是向下滚动页面

在GoogleMaps中，他们提供了可以禁用此功能的scrollwheel属性，但不幸的是，这似乎没有在StreetView中实现

到目前为止，我找到的唯一解决办法是@bennedich在前面的回答中说的，我在街景div的正上方放置了一个空的/透明的div

---

当用户在mousedown事件中使用jQuery隐藏此空div（使用css可见性属性）并单击街景区域的任意位置时，我启用控件，当用户将鼠标移出时，我将此空div放回上方。这基本上意味着每次用户想要与街景控件交互时，他都必须单击它一次。这不是最好的解决方案，但总比在滚动时抓紧鼠标要好

有一个Gmaps API v3问题的功能请求，需要将

滚动轮：false

添加到街景中。现在已经解决了这个问题，只需在您的

街景全景

选项中使用

滚轮：false

。

谷歌提供了一个补丁来解决这个问题

目前有效的修复方法是将版本号显式设置为3.25，以便

scrollwheel:false

正常工作

例如：

---

https://maps.googleapis.com/maps/api/js?key=XXX&v=3.25

我的解决方案如下。使用“滚轮”事件在街景上滚动鼠标后，立即进行手动滚动，并将覆盖带到前面

$('.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;
}

---

很好的建议，这不会禁用与街景的所有交互吗？谢谢更新！我将把它添加到我的站点，而不是我的解决方法。我喜欢将我需要的功能添加到API中；-）谢谢你，弗兰克。很高兴他们终于添加了这个，一行代码，我可以删除所有的蹩脚的解决方法。现在这是正确的答案，应该这样标记。不过，我注意到它会吃掉滚动事件，因此当你到达那里时滚动就会停止。虽然它消除了当你到达那里时恼人的缩放错误，但它仍然是一个错误。虽然这是正确的，并且选项现在可用，但滚轮不会在全景中放大或缩小，页面滚动在全景上方时仍然停止。对我来说，至少在macOS Sierra上使用Chrome和Safari。是的，这仍然是一个BUG。当scrollwheel设置为false时，它不应该仍然捕获鼠标滚动事件，并阻止在页面上滚动。哇！感谢您更新这个非常老的问题，很高兴知道他们计划解决这个问题。