右键单击标记 - Google Maps V3

时间:2013-12-17 12:22:11

标签: javascript jquery google-maps google-maps-api-3 right-click

我一直试图右键点击我的标记,但到目前为止似乎事件并没有被解雇。作为一种解决方法,我目前正在检测地图上的右键单击然后找到最近的标记并触发右键单击方法 - 显然这并不是很好。

根据文档,标记确实有一个右键单击事件,所以我不确定我做错了什么。 https://developers.google.com/maps/documentation/javascript/reference#Marker

google.maps.event.addListener(marker, 'rightclick', handleRightClick)

不起作用,但

google.maps.event.addListener(map, 'rightclick', handleRightClick)

工作正常。同样如下:

google.maps.event.addListener(marker, 'click', handleRightClick)

我还使用了一个名为markerWithLabel的自定义标记插件 - http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.1.9/docs/reference.html - 当我发现这没有为右键单击添加事件监听器时,我认为我已经破解了它,但即使我添加了一个在我自己,仍然没有运气。我在第257行添加了这个:

google.maps.event.addDomListener(this.eventDiv_, "rightclick", function(e) {
    if (me.marker_.getClickable()) {
        google.maps.event.trigger(me.marker_, "rightclick", e);
        cAbortEvent(e);
    }
})

是否有人遇到类似问题或找到了更好的解决方法?

提前致谢。

3 个答案:

答案 0 :(得分:3)

假设你有你的地图对象,它叫做globalmap(你是一个新的google.maps.Map)

这将在地图中心添加标记:

var newmarker=new google.maps.Marker({map:globalmap, position: globalmap.getCenter()});

这将听取右键点击标记;

google.maps.event.addListener(newmarker,  'rightclick',  function(mouseEvent) { alert('Right click triggered'); });

编辑:关于MarkerWithLabel插件,我可以看到它从google.maps.OverlayView扩展,并传入 marker _ 属性中的标记对象。这意味着您仍然可以按照自己的方式进行操作(从示例中复制):

 var marker1 = new MarkerWithLabel({
   position: homeLatLng,
   draggable: true,
   raiseOnDrag: true,
   map: map,
   labelContent: "$425K",
   labelAnchor: new google.maps.Point(22, 0),
   labelClass: "labels", // the CSS class for the label
   labelStyle: {opacity: 0.75}
 });

然后将右键单击行为添加为

google.maps.event.addListener(marker1.marker_,  'rightclick',  function(mouseEvent) { alert('Right click triggered'); });

答案 1 :(得分:2)

你的最后一次尝试:

google.maps.event.addDomListener(this.eventDiv_, "rightclick",function(){/**/});

...将无效,因为没有rightclick - DOMMouseEvent。

您必须观察click的{​​{1}} - 事件,并检查事件的eventDiv_ - 属性是否设置为button(当它正确时 - 已检测到点击)

答案 2 :(得分:1)

右键点击事件适用于google.maps.Marker:

  google.maps.event.addListener(marker, 'rightclick', function() {
    infowindow.setContent("<div style='width:100px'>rightclick</div>");
    infowindow.open(map,marker);
  });

working example