Witam, robię stronę, w której chciałbym pokazać jednocześnie wszystkie pojazdy komunikacji miejskiej danej linii, pobieranie odświeża się co 25 sekund, bo co 25 sekund zmieniają się dane w pliku, które pobieram. Co 25 sekund pojawiają się nowe znaczniki i nie wiem jak usunąc stare, czy ktoś mógłby pomóc mi to zrobić?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.6.0/dist/leaflet.css"
integrity="sha512-xwE/Az9zrjBIphAcBb3F6JVqxf46+CDLwfLMHloNu6KEQCAWi6HcDUbeOfBIptF7tcCzusKFjFw2yuvEpDL9wQ=="
crossorigin="" />
<script src="https://unpkg.com/leaflet@1.6.0/dist/leaflet.js"
integrity="sha512-gZwIG9x3wUXg2hdXF6+rVkLF/0Vi9U8D2Ntg4Ga5I5BZpVkVxlJWbSQtXPSiUTtC0TjtGOmxa1AJPuV0CPthew=="
crossorigin=""></script>
<style>
#mapid {
height: 720px;
}
</style>
<title>Document</title>
</head>
<body>
<button type="button">Wybierz linie</button>
<div id="mapid"></div>
<script>
const mymap = L.map('mapid').setView([54.352024, 18.646639], 12); // tworzenie obiektu mapy, dwie pierwsze liczby to współrzędne, a trzecia to zoom
mymap.setView([54.352024, 18.646639], 12)
const attribution =
'© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'; // atrybucja jest potrzebna do stworzenia mapy
const tileUrl = 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png';// jak wiersz wyzej
const tiles = L.tileLayer(tileUrl, { attribution });// tworzenie mapy
tiles.addTo(mymap);
const api_url = "https://ckan2.multimediagdansk.pl/gpsPositions?";
let start;
function chooseLine() {
async function move() {
const response = await fetch(api_url);
const vehicles = await response.json();
let result = vehicles["Vehicles"].filter(obj => { // tworzenie tablicy obiektów - pojazdów, które mają dany nr linii
return obj.Line === line
})
console.log(result);
for (var vehicle of result) {
L.marker([vehicle["Lat"], vehicle["Lon"]]).addTo(mymap).bindPopup(vehicle["VehicleCode"]); //tworzenie znacznikow dla result
}
}
const line = prompt('wybierz linie');
clearInterval(start);
move();
start = setInterval(move, 25000);
}
const el = document.querySelector("button");
el.addEventListener("click", chooseLine);
</script>
</body>
</html>
Freja DracoFreja Draco