Javascript 传单使用setInterval删除重复标记
我正在制作传单地图和标记。我从JSON获取标记并正确显示 l使用setInterval每5秒刷新一次方法,以更新latlng,旧标记应隐藏并显示新位置标记,无重复。但我尝试了各种方法来实现这一点,但我做不到 正如你们看到的,下图显示了当使用setInterval更新位置时,飞机的标记是如何在地图上重复的。 需要帮忙吗 我的代码:Javascript 传单使用setInterval删除重复标记,javascript,leaflet,Javascript,Leaflet,我正在制作传单地图和标记。我从JSON获取标记并正确显示 l使用setInterval每5秒刷新一次方法,以更新latlng,旧标记应隐藏并显示新位置标记,无重复。但我尝试了各种方法来实现这一点,但我做不到 正如你们看到的,下图显示了当使用setInterval更新位置时,飞机的标记是如何在地图上重复的。 需要帮忙吗 我的代码: $(document).ready(function () { var markers = {}; // Dictionary to hold your mar
$(document).ready(function () {
var markers = {}; // Dictionary to hold your markers in an outer scope.
// map initializing
var coords = [33, 44]; // the geographic center of our map
var zoomLevel = 6 // the map scale.
var map = L.map('map').setView(coords, zoomLevel);
L.tileLayer('https://{s}.tile.thunderforest.com/transport-dark/{z}/{x}/{y}.png', {
attribution: 'Map data ©',
maxZoom: 18
}).addTo(map);
// Aircraft data
setInterval(function () {
$.ajax('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx', {
type: 'GET',
dataType: 'jsonp',
timeout: 5000
}).done(function (data, textStatus, jqXHR) {
Object.keys(data)
.map(key => data[key])
.map((position) => ({
lat: position[1],
lng: position[2],
})).filter(position =>
position.lat &&
position.lng &&).forEach(i => {
if (!markers[i.lat, i.lng]) {
// If there is no marker with this id yet, instantiate a new one.
markers[i.lat, i.lng] = L.marker([i.lat, i.lng]).addTo(map)
}
markers[i.lat, i.lng].setLatLng(i.lat, i.lng)
})
}, 5000)
});
将标记添加到图层组,然后将其清除
var fg = L.featureGroup().addTo(map)
setInterval(function(){
$.ajax('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx', {
type: 'GET',
dataType: 'jsonp',
timeout: 5000
}).done(function (data, textStatus, jqXHR) {
fg.clearLayers();
markers = {};
Object.keys(data)
.map(key => data[key])
.map((position) => ({
lat: position[1],
lng: position[2],
})).filter(position =>
position.lat &&
position.lng &&).forEach(i => {
markers[i.lat, i.lng] = L.marker([i.lat, i.lng]).addTo(fg)
})
},5000)
将标记添加到图层组,然后将其清除
var fg = L.featureGroup().addTo(map)
setInterval(function(){
$.ajax('xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx', {
type: 'GET',
dataType: 'jsonp',
timeout: 5000
}).done(function (data, textStatus, jqXHR) {
fg.clearLayers();
markers = {};
Object.keys(data)
.map(key => data[key])
.map((position) => ({
lat: position[1],
lng: position[2],
})).filter(position =>
position.lat &&
position.lng &&).forEach(i => {
markers[i.lat, i.lng] = L.marker([i.lat, i.lng]).addTo(fg)
})
},5000)
我假设您正在尝试轮询api,以在每5000ms后获取飞机的当前位置,并使用标记在地图上呈现该位置?是的,我尝试做的是我假设您正在尝试轮询api,以在每5000ms后获取飞机的当前位置,并使用标记在地图上呈现该位置?是的我想做什么