我可以在Google Map中使用带有scrollwheel选项的滚动元素：true吗？

Question

我有一张带有 scrollwheel：true

选项的Google地图。

我正在将OverlayView添加到Google地图中，该地图包含具有可滚动内容的HTML。当我将鼠标悬停/单击到OverlayView时，鼠标滚轮会继续缩放Google地图，而不是滚动Overlayview的内容。

如何防止这种行为发生？

我曾尝试将Google地图的选项更改为 scrollwheel：false 作为OverlayView的onclick事件，但这似乎不会触发。

Answer 1

您可以将HTML内容放入InfoWindow中，并在地图上使用gestureHandling : "greedy"，以便可以在光标位于地图上而不是InfoWindow上时控制缩放。 （信息窗口的内容仍可滚动）

小提琴样本： https://jsfiddle.net/471fmzyv/

function initMap() {
  var uluru = {lat: -25.363, lng: 131.044};
  var map = new google.maps.Map(document.getElementById('map'), {
    zoom: 4,
    center: uluru,
    gestureHandling : "greedy"
  });

Answer 2

InfoWindow可能是解决此问题的正确方法，但这不是我们要遵循的路线，因为这将意味着需要大量更改我们的代码以在OverlayView中处理InfoWindows。

相反，我们最终在OverlayView上为mouseover和mouseout事件添加了侦听器，然后根据鼠标事件切换了Google Map和页面行为：

8.8.8.8.in-addr.arpa name = google-public-dns-a.google.com.