Google Map Pinch无法在触摸屏电视上工作

Question

我在网站上使用google-maps-api v3嵌入了Google Maps。我正在尝试使用触摸屏电视放大地图，但是它不断调整浏览器窗口的大小。我正在使用firefox。

http://www.spectrumgeo.com/mcmap/large.php

以下代码可防止使用键盘ctrl (-/+)

缩放

$(document).keydown(function(event) {
            if (event.ctrlKey==true && (event.which == '107' || event.which == '109')) {
                alert('disabling zooming ! ');
                event.preventDefault();
             }
        });

我在这里尝试过锤子，但不起作用。

var myElement = document.getElementById('googlemap');
        var mc = new Hammer.Manager(myElement);
        // create a pinch and rotate recognizer
        // these require 2 pointers
        var pinch = new Hammer.Pinch();
        var rotate = new Hammer.Rotate();
        // we want to detect both the same time
        pinch.recognizeWith(rotate);
        // add to the Manager
        mc.add([pinch, rotate]);
        mc.on("panleft panright tap press", function(ev) {
            //myElement.textContent = ev.type +" gesture detected.";
            alert(ev.type +" ");
        });
        mc.on("pinch rotate", function(ev) {
            //myElement.textContent += ev.type +" ";
            alert(ev.type +" ");
        });

Answer 1

进行了大量的研究和阅读大量博客后，可以通过欺骗用户代理或设置导航器的MSMAXTOUCHPOINTS属性来实现。这是灵感来自Brian（https://github.com/bamnet/map_sandbox/tree/master/master/forcetouchui）的解决方案。我通过设置navigator.msmaxtouchpoints属性进行了修改，以使其正常工作，如JSFIDDLE示例

所示

我们最终做的事情

function EnableTouchUI(){
  // Check if the browser supports touch events
  if('ontouchstart' in window || window.DocumentTouch && document instanceof DocumentTouch) {
    	navigator = navigator || {};
	navigator.msMaxTouchPoints = navigator.msMaxTouchPoints || 2;
  }
}
jQuery(document).ready(function(){
	EnableTouchUI();
}); 

在此处查看工作示例https://jsfiddle.net/abidcharlotte49er/qln8hkv0/

Answer 2

根据文档，只有移动设备才能具有触摸控制。似乎没有设置可以启用它。但是，您可以将用户代理设置为Android平板电脑启用它。