google-maps - Google Map API V3 事件 mousedown、mousemove 和 mouseup

标签 google-maps google-maps-api-3

我试图在谷歌地图中模仿谷歌地球的桌面版绘图路径。我所做的是,当我尝试绘制路径时,我禁用了默认 map 的可拖动事件并附加了一个 mousedown 事件。在 mousedown 事件之后,mousemove 事件被触发并相应地工作。当鼠标释放事件被捕获在 mouseup 处理程序中,其中 mousemove 处理程序在 mouseup 事件监听器中被删除。但是,这在第二个 mousedown 和 mouseup 事件之后无法正常工作。

我的代码是:

var map = 'Already created map object';
var polyOptions = {
                    strokeColor: '#000000',
                    strokeOpacity: 1.0,
                    strokeWeight: 2,
                    map: map,
                    idx: 0
                };
var mouseMoveHandler = null;
google.maps.event.addListener(map, 'mousedown', function(e) {
  mouseMoveHandler = google.maps.event.addListener(map, 'mousemove', function(e) {
  // Create a new polyline instance if it does not exists
  if ("undefined" == typeof(GMap._poly[GMap._active_overlay])) {
    GMap._poly[GMap._active_overlay] = new google.maps.Polyline(polyOptions);
  }
  var path = GMap._poly[GMap._active_overlay].getPath();
  path.push(e.latLng);
  }); // End of mousemove lister
  return false;
});

google.maps.event.addListener(map, 'mouseup', function(e) {
  google.maps.event.removeListener(mouseMoveHandler);
});

最佳答案

将此添加到 polyOptions:

clickable:false

否则,多边形将监听鼠标事件,并且 mouseup-event 将在多边形上而不是在 map 上触发。

关于google-maps - Google Map API V3 事件 mousedown、mousemove 和 mouseup,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17521671/

相关文章:

ios - (iOS Swift)谷歌地图 animateWithCameraUpdate 不工作

java - Android 谷歌地图定位权限

jquery - 使用 jQuery 提取 XML 中的 CDATA 以用作 HTML 内容

实现google places sdk时Android构建错误

ios - Ionic ios 模拟器不加载谷歌地图

javascript - 如何让谷歌标记 url 在新的浏览器窗口或标签中打开?

javascript - 如何在 Biostall Google Maps V3 API 中更改的边界上将自定义变量名称插入到 poerform 中?

php - 在 MySQL Maps v3 中保存标记

javascript - 如何使用 Google Maps JS API 从热图切换到可点击标记?

google-maps-api-3 - 有没有办法切换 MarkerClusterPlus