禁用Ctrl +滚动缩放谷歌地图

Question

有人知道怎么禁用CTRL+ Scroll？

首先移动鼠标滚轮时,地图会放大/缩小.但现在要求按CTRL+鼠标滚轮滚动放大/缩小.

我们如何禁用此功能？我似乎无法在文档中找到任何内容:

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

Answer 1

您需要传递gestureHandling: 'greedy'到地图选项.

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

例如:

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

Answer 2

如果您可以完全禁用滚动缩放,则可以使用scrollwheel: false.如果您为缩放控件提供缩放控件(zoomControl: true),用户仍然可以通过单击缩放按钮来缩放地图.

文档:https: //developers.google.com/maps/documentation/javascript/reference (搜索"scrollwheel"页面)

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

Answer 3

如果您只想隐藏叠加层但仍然禁用滚动和缩放的功能（像以前一样），您可以使用 CSS 来隐藏叠加层：

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

请注意，这也会为移动设备隐藏它，因此您可以使用类似的方法来确保它显示“使用两个手指移动地图”：

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

Answer 4

在版本“3.35.6”上嵌套gestureHandling一个options属性对我有用。

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