使用我的代码,每次单击地图时都会出现几个标记。
我想只需一个标记,每次点击都会移除上一个标记并将新标记的lat / lng设置为新位置。
这是我的代码:
var map;
var markers = [];
function initMap() {
var aa = {lat: 32.3896651, lng: 48.3791718};
map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: aa
});
// This event listener will call addMarker() when the map is clicked.
map.addListener('click', function(event) {
addMarker(event.latLng);
document.getElementById("la").value = event.latLng.lat();
document.getElementById("lo").value = event.latLng.lng();
});
}
// Adds a marker to the map and push to the array.
function addMarker(location) {
var marker = new google.maps.Marker({
position: location,
flat: false,
map: map,
draggable: true
});
markers.push(marker);
}
// Sets the map on all markers in the array.
function setMapOnAll(map) {
for (var i = 0; i < markers.length; i++) {
markers[i].setMap(map);
}
}
// Removes the markers from the map, but keeps them in the array.
function clearMarkers() {
setMapOnAll(null);
}
// Shows any markers currently in the array.
function showMarkers() {
setMapOnAll(map);
}
// Deletes all markers in the array by removing references to them.
function deleteMarkers() {
clearMarkers();
markers = [];
}
答案 0 :(得分:1)
每次添加新标记,都会在页面中创建许多对象。 为什么不重复使用现有的标记?使标记全局而不是标记数组,
var marker = null;
然后使用 setPosition 来更改现有标记对象的位置:
marker.setPosition(location);
这样,您只使用一个标记,只是在不同的位置。
var map;
var marker = null;
function initMap() {
var aa = {lat: 32.3896651, lng: 48.3791718};
map = new google.maps.Map(document.getElementById('map'), {
zoom: 12,
center: aa
});
// This event listener will call addMarker() when the map is clicked.
map.addListener('click', function(event) {
addMarker(event.latLng);
document.getElementById("la").value = event.latLng.lat();
document.getElementById("lo").value = event.latLng.lng();
});
}
// Adds a marker to the map and push to the array.
function addMarker(location) {
if(marker)
marker.setPosition(location);
else
marker = new google.maps.Marker({
position: location,
flat: false,
map: map,
draggable: true
});
}
// Sets the map on all markers in the array.
function setMapOnAll(map) {
marker.setMap(map);
}
// Removes the markers from the map, but keeps them in the array.
function clearMarkers() {
marker.setMap(null);
}
// Shows any markers currently in the array.
function showMarkers() {
marker.setMap(map);
}
// Deletes all markers in the array by removing references to them.
function deleteMarkers() {
clearMarkers();
}
答案 1 :(得分:0)