javascript - 移动设备上的 Google Maps API 滑动与屏幕滚动冲突

当用户在移动设备上查看我的网站时，有时他们会遇到 Google map 滚动进入 View 并覆盖整个页面的情况。他们无法再滚动，因为当他们向上或向下滑动时，他们只会在 Google map 中平移 View ，而不会滚动网页。

传统上我对移动设备的修复是这样的:

var mapOptions = {
  draggable: false,
  panControl: true,
}

这基本上禁用了谷歌地图上的滑动事件，因此用户可以滑动滚动网页。如果用户想要真正平移 map ，他们可以点击平移按钮 UI。

从 3.22 版开始，Google Maps API 已禁用平移控制按钮 see official google doc .这给我带来了一个大问题 - 如果我禁用“可拖动”，则没有其他方法可以平移 map

如何让用户能够使用滑动手势滚动网页，同时让他们在需要时平移 map ？

---

Best Answer-推荐答案

这完全取决于您网站的设计/流程。我可以根据与您类似的情况提供一些我必须实现的解决方案。

1) 如果 map 不是您页面的主要内容，您只需检查浏览器是否是移动浏览器，然后将 map div 替换为静态 map 图像，单击该图像会打开 map 专用页面。

2) 您可以通过 map.setOptions({draggable: true/false}); 在 map 顶部添加一个操作来切换 map 的禁用属性，以便用户可以切换它自己开和关。

关于javascript - 移动设备上的 Google Maps API 滑动与屏幕滚动冲突，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34912181/