3

我想通过右键单击并选择并在其上执行功能（更改颜色，...）来在形状（圆，矩形，多边形）上显示菜单。
1）我首先为我的形状定义一个事件： 

google.maps.event.addListener(myShape, 'rightclick', function(event) {...}

2）然后我定义一个 div 并创建菜单：

myMenu = document.createElement("div");
myMenu.className  = 'contextmenu';
myMenu.innerHTML = "<a id='menu1'>item 1<\/a><a id='menu2'>item 2<\/a>";

3）在我必须将此 div 与我的形状相关联之后：
我不知道如何
进行 4）最后我必须在 event.LatLng 位置显示菜单：
我不知道如何进行，可能是这样的：

$('.contextmenu').css('left',x  );
$('.contextmenu').css('top',y );

你能帮忙吗 ？

4

1 回答 1

2

您没有具体说明要添加上下文菜单的元素，所以我只是添加了一个新圆圈并做了一些“快速而肮脏”的示例：http: //jsfiddle.net/8Apwr/1/

诀窍就在这里：

var overlay = new google.maps.OverlayView();
overlay.draw = function() {};
overlay.setMap(map);

google.maps.event.addListener(cityCircle, 'rightclick', function(event) {
   var pos = overlay.getProjection().fromLatLngToDivPixel(event.latLng);
   $('#menu').show();
   $('#menu').css("left", pos.x);
   $('#menu').css("top", pos.y);
});

为了获得最佳结果，您应该真正考虑创建一个新的自定义覆盖 ( https://developers.google.com/maps/documentation/javascript/overlays#CustomOverlays ) 来绘制上下文菜单。这样它就可以被重用并且代码得到更好的组织。

于 2013-06-12T17:38:42.960 回答