谷歌地图API V3支持触摸事件吗？

Question

我们遇到了与GoogleMaps相关的问题。这个问题主要与触摸屏有关。我们一直在尝试解决，但是目前没有成功。

我们发现在这篇文章中，Google Maps API V3是否支持触摸事件？这是真的还是假的？ 更新 这个问题已经在bug中处理了。

https://issuetracker.google.com/issues/35824421

这个问题在2016年12月Google Maps JavaScript API的3.27版本中得到解决。

- Yaqub Ahmad

Answer 1

依照我的经验，mousedown、mouseup、dragstart 和 dragend 事件可以很好地代替 touchstart、touchmove 和 touchend。

google.maps.event.addListener(myMap, "mousedown", function(event){...});

我很确定gesture事件不会得到支持，因为这些事件被用于捏合缩放功能。

如果您需要手势，您必须通过跟踪mousedown事件，将它们存储在数组中，然后跟踪位置以确定角度、距离等来构建自己的识别器...

- tim

Answer 2

它们目前不受支持。请查看这里的交互式地图，显示当前可用事件的演示：

https://developers.google.com/maps/documentation/javascript/events#EventsOverview

这个页面还说明了以下内容：

要获取完整的事件列表，请参阅Google Maps JavaScript API参考文档。

该页面中没有触摸相关的事件，因此不支持触摸事件。

对于已接受的答案进行评论，支持的事件并非严格等同（触摸与鼠标点击明显在语义上有所不同），而且根据我的经验，结果可能会有所不同（例如，在某些情况下，触摸可能导致Google地图上的onclick事件触发，而在某些情况下，则会导致mouseover事件触发），因此可能需要一些回退处理来可靠地处理这种情况，当“借用”这些事件来检测触摸时。

以下是一篇关于使用侦听器处理触摸的好文章：

https://www.google.com.au/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&ved=0ahUKEwiwm6y38dXXAhWHVbwKHRdUCY4QFggmMAA&url=https%3A%2F%2Fmedium.com%2F%40david.gilbertson%2Fthe-only-way-to-detect-touch-with-javascript-7791a3346685&usg=AOvVaw3pWv0R_AESWKqwF72D0hix

- Chris Halcrow

Answer 3

利用 mousedown、mouseup 以及 e.domEvent.pointerType == "touch"，可以检测事件类型：

map/marker.addListener("mousedown"/"mouseup", (e) => {
  if(e.domEvent.pointerType == "touch") console.log("touch");
  else console.log("mouse/pen")
});

注意：e.domEvent.pointerType在mousemove上不起作用（顺便说一下，它仅适用于地图而不是标记），因此我建议使用document.addEventListener()来处理mousemove/touchmove事件，并标记地图/标记的当前鼠标/触摸按下/抬起状态以识别mousemove事件类型。

- ATP