在Google地图上只允许使用一个标记

时间:2017-07-06 17:21:58

标签: javascript google-maps

我希望用户在网页上的Google地图上放置标记。如果用户再次单击,则第一个标记应该消失,并替换为新标记。我将如何从Google提供的此代码开始执行此操作:

function myMap() {
        var mapCanvas = document.getElementById("map");
        var mapOptions = {
        center: new google.maps.LatLng(51.7, 5), zoom: 6
        };
        var map = new google.maps.Map(mapCanvas, mapOptions);

        google.maps.event.addListener(map, 'click', function(event) {
            marker = new google.maps.Marker({
            position: event.latLng,
            map: map
            });
        });

我的第一次尝试是在addListener函数的开头添加marker.remove();,这对我来说不起作用。

提前感谢您的帮助!

2 个答案:

答案 0 :(得分:0)

自己找到答案。用以下代替AddListener非常有效:

GoogleMaps v3 API Create only 1 marker on click

var marker;

function placeMarker(location) {
 if ( marker ) {
   marker.setPosition(location);
 } else {
  marker = new google.maps.Marker({
  position: location,
  map: map
  });
 }
}

google.maps.event.addListener(map, 'click', function(event) {
  placeMarker(event.latLng);
});

答案 1 :(得分:0)

以下代码可帮助您在用户点击时放置标记。如果用户再次单击,则删除较早的标记并标记新位置。我的回答是为了在你做的第一次尝试中纠正你的错误。试试这个。

  var flag=0,marker;
  map.addListener('click', function(e) {
  if(flag)
    marker.setMap(null);
  else
    flag=1;
  marker = new google.maps.Marker({
    position: e.latLng,
    map: map});
  });