点击谷歌地图关闭标记

时间:2014-04-12 11:40:10

标签: javascript google-maps google-maps-api-3

我点击地图在谷歌地图上添加标记。现在,我希望通过点击标记删除谷歌地图上的标记,但没有运气尝试。

var myMean = new google.maps.LatLng(22.321074,87.307710);

var map = new google.maps.Map(document.getElementById('map'), {
  zoom: 15,
  center: myMean,
  mapTypeId: google.maps.MapTypeId.ROADMAP
});

var icon = new    google.maps.MarkerImage("http://maps.google.com/mapfiles/ms/micons/blue.png", new google.maps.Size(32, 32), new google.maps.Point(0, 0), new google.maps.Point(16, 32));


var points=[];
var markers=[];


function setAllMap(map) 
{
    for (var i = 0; i < markers.length; i++) 
    {
        markers[i].setMap(map);
    }
}



function addMarker(point)
{
    var marker=new google.maps.Marker(
    {
        position: point,
        icon: icon,
        map: map 
    });
    markers.push(marker);

    google.maps.event.addListener(marker, "click", function()
    {
        var i;
        for(i=0;i<points.length;i++)
        {
            if(points[i].equals(point))
            {
                points.splice(i,1);
                markers.splice(i,1);
            }
        }
        setAllMap(null);
        setAllMap(map);
        alert(points);
    });
}

google.maps.event.addListener(map, 'click', function(event) {
    points.push(event.latLng);
    alert(points[points.length-1]);
    addMarker(points[points.length-1]);
});

我正在尝试维护标记列表,并从列表中删除当前标记并在地图上设置其他标记,但它无法正常工作。 请告诉标记的监听者需要修改哪些内容,以便通过点击删除标记。

1 个答案:

答案 0 :(得分:1)

您正在将所有标记的地图设置为错误位置的null。您应该在之前设置地图中的所有标记,然后删除当前单击的标记。

因此,如果你改变这样的addMarker逻辑,它应该有效:

function setAllMap(map){         for(var i = 0; i&lt; markers.length; i ++){             标记物[I] .setMap(地图);         }     }

function addMarker(point) {
    var marker = new google.maps.Marker({
        position: point,
        map: map
    });
    markers.push(marker);
    google.maps.event.addListener(marker, "click", function () {
        setAllMap(null);
        var i;
        for (i = 0; i < points.length; i++) {
            if (points[i].equals(marker.getPosition())) {
                points.splice(i, 1);
                markers.splice(i, 1);
            }
        }

        setAllMap(map);
        //alert(points);
    });
}

工作示例here