Google Maps api v3 - 在点击事件中添加新标记之前删除标记

时间:2013-01-19 07:27:02

标签: javascript google-maps-api-3

我使用以下代码并试图找出如何添加一个我可以调用的函数,它将在添加新标记之前删除之前的标记。地图使用onclick事件来添加用户点击的标记...基本上我在任何给定时间只需要地图上的一个标记。

我已经搜索并尝试了几乎所有内容,但必须以某种方式做错...请快速浏览一下代码并让我知道它将如何实现。

感谢百万!

<script>
  function initialize() {
    var mapOptions = {
      zoom: 11,
      center: new google.maps.LatLng(document.getElementById('field_lat').value,document.getElementById('field_lng').value),
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    var map = new google.maps.Map(document.getElementById('map_canvas'),
        mapOptions);

    google.maps.event.addListener(map, 'click', function(e) {


        // SET MY UI SEARCH TEXT FIELDS TO THE LAT AND LNG
        document.getElementById('field_lat').value = e.latLng.lat();
        document.getElementById('field_lng').value = e.latLng.lng();


      placeMarker(e.latLng, map);
    });
  } 

  function placeMarker(position, map) {
      //Marker.setMap(null);
    var Marker = new google.maps.Marker({
         position: position,
         map: map
    });
    map.panTo(position);

    $("#listbox ul").empty();
    docall(); 
  }

  google.maps.event.addDomListener(window, 'load', initialize);

</script>

地图在正文中如下

<div id="map_canvas" style="width: 400px; height: 400px;"></div>

我试图让这个或类似的东西工作,但没有骰子......

// Deletes all markers in the array by removing references to them
function deleteOverlays() {
if (markersArray) {
for (i in markersArray) {
markersArray[i].setMap(null);
}
markersArray.length = 0;
}
}

3 个答案:

答案 0 :(得分:4)

如果有,请删除上一个标记。

var Marker;
function placeMarker(position, map) {
  if(typeof marker!= 'undefined')
      marker.setMap(null);
  var Marker = new google.maps.Marker({
     position: position,
     map: map
  });
  map.panTo(position);

  $("#listbox ul").empty();
  docall(); 
}

答案 1 :(得分:2)

只需执行以下操作:

予。声明一个全局变量:

var markersArray = [];

II。定义一个函数:

function clearOverlays() {
  for (var i = 0; i < markersArray.length; i++ ) {
   markersArray[i].setMap(null);
  }
}

OR

google.maps.Map.prototype.clearOverlays = function() {
  for (var i = 0; i < markersArray.length; i++ ) {
     markersArray[i].setMap(null);
  }
}

III。在调用以下内容之前在'markerArray'中推送标记:

markersArray.push(marker);
google.maps.event.addListener(marker,"click",function(){});

IV。在任何需要的地方调用该函数。

clearOverlays();

OR

map.clearOverlays(); 

就是这样!!

希望能帮助你。

来源:Google Maps API v3: How to remove all markers?

答案 2 :(得分:0)

您可以在第一次点击时设置标记,然后只需更改后续点击的位置即可。

var marker;

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

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