嵌入式 Google 地图上的双指缩放可缩放整个页面

Question

如何在基于 Google Maps v3 的网络应用程序中使双指缩放功能正常工作？ 现在，在触摸屏 Windows 8 设备上捏合将缩放整个页面，而不是地图。 我已经在 Chrome 和 Firefox 中尝试过这个，它在谷歌地图网站上正常工作，但在我的网站上却没有。

我的<head>元素中有以下元标记，但它似乎没有帮助。 我需要添加另一个元标记吗？ 我查看了 Google Maps 站点的来源，但找不到任何看起来相关的元标记。

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">

Answer 1

这很可能是因为您正在使用叠加层。

您可以通过添加以下代码来阻止捏合和拖动：

window.blockMenuHeaderScroll = false;
$(window).on('touchstart', function(e)
{
    if ($(e.target).closest('#map').length == 1)
    {
        blockMenuHeaderScroll = true;
    }
});
$(window).on('touchend', function()
{
    blockMenuHeaderScroll = false;
});
$(window).on('touchmove', function(e)
{
    if (blockMenuHeaderScroll)
    {
        e.preventDefault();
    }
});

感谢https://stackoverflow.com/a/17159809

Answer 2

我是windows froms开发的，内置webbrowser用来显示googleMap，但是发现在触摸设备上，双指缩放会导致整个页面缩放，而不是地图缩放，最后我的解决方案如下: 在gpedit.msc中，禁用了浏览器页面缩放功能来实现这个效果，但是我觉得还不是很完美，为什么webbrowser处理页面缩放优先级会被googleMap更高

嵌入式 Google 地图上的双指缩放可缩放整个页面

问题描述

2 个解决方案

解决方案1
0 2016-10-14 14:22:21

解决方案2
-2 2018-06-08 08:32:49

嵌入式 Google 地图上的双指缩放可缩放整个页面

问题描述

2 个解决方案

解决方案1 0 2016-10-14 14:22:21

解决方案2 -2 2018-06-08 08:32:49

解决方案1
0 2016-10-14 14:22:21

解决方案2
-2 2018-06-08 08:32:49