google-maps-api-3 - Google Maps Api 3 仅删除选定的标记

Question

我有2个功能如下:

function addMarker() {
    marker = new google.maps.Marker({
        position: Gpoint,
        map: map,
        draggable: true,
        animation: google.maps.Animation.DROP
    });
    map.panTo(Gpoint);

    google.maps.event.addListener(marker, "rightclick", 
    function (point) { 
    showContextMarker(point.latLng); } ); 
    $('.contextmenu').remove();
};

function delMarker() { marker.setMap(null); $('.contextmenu').remove(); };

因此，据了解，我有一个上下文菜单，上面有“删除标记”选项。
我在添加标记期间绑定(bind)了一个“右键单击”监听器，以显示此菜单。

到目前为止，一切都在正常工作。

但是当我尝试单击要删除的标记时；它只影响最后添加的标记。
当我再次尝试时；没发生什么事。

所以我的想法是获取点击标记的 id(或可能很有用的东西)并根据这个运行这个删除功能。

简要地;我想从具有多个标记的 map 中删除我单击的标记。

你有什么方法可以解决这个问题吗？

提前致谢!

解决了!

这是解决方案。谢谢法提赫。没有您的指导是不可能的:

var id;
var markers = {};
var addMarker = function () {
    marker = new google.maps.Marker({ 
        position: Gpoint,
        map: map,
        draggable: true,
        animation: google.maps.Animation.DROP
    });
    map.panTo(Gpoint);
    id = marker.__gm_id
    markers[id] = marker; 

    google.maps.event.addListener(marker, "rightclick", function (point) { id = this.__gm_id; delMarker(id) });
}

var delMarker = function (id) {
    marker = markers[id]; 
    marker.setMap(null);
}

调用删除函数: delMarker(id)Ps:“这种情况下右键就够了”

谢谢!

Answer 1

Working Sample on jsFiddle

Google map 不管理您的标记。所以你所有的标记都应该由你自己管理。

制作一个全局标记对象并将所有标记推送到该对象。并在获取标记实例时为每个标记提供唯一的 id。然后当你想删除一个标记时，获取它的 id 并在全局标记对象中找到这个标记，最后调用这个标记实例的 setMap 方法并传递 null 参数。

我还添加了一个适用于 jsFiddle 的演示。代码有大量文档。

你的伪代码应该是这样的。 更详细的代码请看demo。

var currentId = 0;
var uniqueId = function() {
返回++currentId;
}

变量标记 = {};
var createMarker = 函数() {
var id = uniqueId();//获取新的id
var marker = new google.maps.Marker({//创建一个标记并设置 id
身份证:身份证，
位置:G点，
map : map ，
可拖动:真，
动画:google.maps.Animation.DROP
});
标记[id] = 标记；//将创建的标记缓存到以 id 为键的标记对象
返回标记；
}
var deleteMarker = 函数(id){
var 标记 = 标记[id];//根据给定的 id 找到标记
标记.setMap(null);
}