Question

我正在使用JSP，Postgres和Tomcat开展寻宝活动。登录后，它应该允许管理员指定地图位置，将各种对象（如已保存在我的数据库中的宝藏和NPC）添加到地图，并能够复制，粘贴和删除任何对象。登录和插入各种类型的对象之类的东西都在工作，但现在我想为每个标记启用右键单击上下文菜单，这将给出admin 3-4选项;复制，粘贴，删除，编辑。

为实现这一目标，我发现链接非常有用，其中提供了上下文菜单的源代码：http://code.martinpearman.co.uk/googlemapsapi/contextmenu/1.0/src/ContextMenu.js

我创建了一个ContextMenu.js文件并复制了上面的代码，然后在我的jsp文件中使用了以下函数。请注意，我正在从我的数据库中检索标记列表作为JSON对象并循环遍历它以创建标记并将其放置在地图上。

function drawMap(){
            var markers = {};
            var contextMenu;

    var contextMenuOptions={};
    contextMenuOptions.classNames={menu:'context_menu', 
    menuSeparator:'context_menu_separator'};

    //  create an array of ContextMenuItem objects
    var menuItems=[];

    menuItems.push({id: "copy", className:'context_menu_item', 
    eventName:'copy_click', label:'Copy'});

    menuItems.push({id: "paste", className:'context_menu_item', 
    eventName:'paste_click', label:'Paste'});

    menuItems.push({id: "delete", className:'context_menu_item', 
    eventName:'delete_click', label:'Delete'});

    contextMenuOptions.menuItems=menuItems;

            lat='43.56873147104461';
            lng='-79.76628009520937';

            map = new google.maps.Map(
                    document.getElementById("map_container"), {
                      center: new google.maps.LatLng(lat,lng),
                      zoom: 15,
                      mapTypeId: google.maps.MapTypeId.ROADMAP
                    });

json ='<%=request.getSession().getAttribute("data")%>'

                json = JSON.parse(json);


                for (i = 0; i <= json.length; i++) {
                    var lt,ln;

                    lat = json[i].latstr;
                    lng = json[i].lngstr;

                marker = new google.maps.Marker({
                        position:  new google.maps.LatLng(lat, lng),
                        map: map
                    });
           contextMenu = new ContextMenu(map, contextMenuOptions); //stops at this point

           google.maps.event.addListener(marker, 'rightclick',function(e) {
           contextMenu.show(e.latLng);
                  });
        }  //end for loop

  google.maps.event.addListener(contextMenu, 'menu_item_selected', 
  function(object, latLng, eventName){
        //  latLng is the position of the ContextMenu
        //  eventName is the eventName defined for the clicked 
            ContextMenuItem in the ContextMenuOptions
            switch(eventName){
                case 'copy_click':
                    copyObject(object);
                    break;
                case 'paste_click':
                    pasteObject(object, latLng);
                    break;
                case 'delete_click':
                    deleteObject(object);
                    break;
            }
        });
}   //end function drawMap();

我不确定问题出在哪里。当我运行程序时，它只显示地图上的第一个标记，右键单击不执行任何操作，我已经尝试alert("hi");来检查问题。它停在

contextMenu = new ContextMenu(map, contextMenuOptions);

我还尝试在ContextMenu函数中放置一个警报，然后在第二行停止

this.setMap(map);

当我评论它时，它超出了这一点，显示循环中的所有标记，但右键单击不执行任何操作。这意味着contextMenu.show(e.latLng);无效。它可能与for循环有关。

如何在Google地图上创建和绑定带有标记数组的上下文菜单？

0 个答案: