我有一个按钮，点击它可以识别用户的当前位置。问题是，如果他们再次点击按钮，因为他们的设备对他们的位置变得更加精确，则会向地图添加另一个标记。他们点击的次数越多，创建的标记就越多。
如果再次单击“定位当前位置”按钮，如何删除/更新/刷新标记的第一个实例？
这是我的定位功能：
function findCurrentPosition() {
// start the geolocation API
if (navigator.geolocation) {
// when geolocation is available on your device, run this function
navigator.geolocation.getCurrentPosition(foundYou, notFound);
} else {
// when no geolocation is available, alert this message
alert('Geolocation not supported or not enabled.');
}
}
function foundYou(position) {
// convert the position returned by the geolocation API to a google coordinate object
var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
// then try to reverse geocode the location to return a human-readable address
geocoder.geocode({ 'latLng': latlng }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
// if the geolocation was recognized and an address was found
if (results[0]) {
// add a marker to the map on the geolocated point
marker = new google.maps.Marker({
position: latlng,
map: map
});
// compose a string with the address parts
var address = results[0].address_components[1].long_name + ' ' + results[0].address_components[0].long_name + ', ' + results[0].address_components[3].long_name
// set the located address to the link, show the link and add a click event handler
// onclick, set the geocoded address to the start-point formfield
$('#from').text(address);
$('#from').val(address);
// call the calcRoute function to start calculating the route
}
} else {
// if the address couldn't be determined, alert and error with the status message
alert("Geocoder failed due to: " + status);
}
});
}
由于
答案 0 :(得分：2)
以下代码导致每次调用foundYou方法时都会创建新标记的问题。
marker = new google.maps.Marker({
position: latlng,
map: map
});
而是在marker方法之外声明foundYou变量，如
marker = new google.maps.Marker({
map: map
});
然后使用setPosition(latLng)方法 更新 marker's位置。
marker.setPosition(latlng); // this will update the position of the marker
答案 1 :(得分：0)
您可以简单地记住当前状态以再次禁用地理编码，因为当他们第二次立即点击按钮时他们不会改变他们的位置：
// should evaluate to true if geocoder is busy
// be sure it is set before findCurrentPosition() call
isBusy=false;
function findCurrentPosition() {
// start the geolocation API if its not busy
if(!isBusy){
if (navigator.geolocation) {
//now youre geocoder will be busy
isBusy = true;
// when geolocation is available on your device, run this function
navigator.geolocation.getCurrentPosition(foundYou, notFound);
} else {
// when no geolocation is available, alert this message
alert('Geolocation not supported or not enabled.');
}
}else {
console.log("already finding");
}
}
function foundYou(position) {
// convert the position returned by the geolocation API to a google coordinate object
var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
// then try to reverse geocode the location to return a human-readable address
geocoder.geocode({ 'latLng': latlng }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
// if the geolocation was recognized and an address was found
if (results[0]) {
// add a marker to the map on the geolocated point
marker = new google.maps.Marker({
position: latlng,
map: map
});
// compose a string with the address parts
var address = results[0].address_components[1].long_name + ' ' + results[0].address_components[0].long_name + ', ' + results[0].address_components[3].long_name
// set the located address to the link, show the link and add a click event handler
// onclick, set the geocoded address to the start-point formfield
$('#from').text(address);
$('#from').val(address);
// call the calcRoute function to start calculating the route
}
} else {
// if the address couldn't be determined, alert and error with the status message
alert("Geocoder failed due to: " + status);
}
// Now the geoCoder finished doing what it should
isBusy = false;
});
}
答案 2 :(得分：0)
我会使用如下所示的removeMarkers（）方法：
function findCurrentPosition() {
// start the geolocation API
if (navigator.geolocation) {
// when geolocation is available on your device, run this function
navigator.geolocation.getCurrentPosition(foundYou, notFound);
} else {
// when no geolocation is available, alert this message
alert('Geolocation not supported or not enabled.');
}
}
function foundYou(position) {
// convert the position returned by the geolocation API to a google coordinate object
var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
// then try to reverse geocode the location to return a human-readable address
geocoder.geocode({ 'latLng': latlng }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
// if the geolocation was recognized and an address was found
if (results[0]) {
//remove markers berfore creating them.
map.removeMarkers();
// add a marker to the map on the geolocated point
marker = new google.maps.Marker({
position: latlng,
map: map
});
// compose a string with the address parts
var address = results[0].address_components[1].long_name + ' ' + results[0].address_components[0].long_name + ', ' + results[0].address_components[3].long_name
// set the located address to the link, show the link and add a click event handler
// onclick, set the geocoded address to the start-point formfield
$('#from').text(address);
$('#from').val(address);
// call the calcRoute function to start calculating the route
}
} else {
// if the address couldn't be determined, alert and error with the status message
alert("Geocoder failed due to: " + status);
}
});
}
答案 3 :(得分：0)
您可以删除最后创建的标记。
if(marker){
marker.setMap(null);
marker = '';
}
在创建新标记之前插入此内容。
您应该从foundYou函数中删除标记创建。