Используйте следующее. Это помогло мне.
document.getElementById('image_1').offsetTop
См. Также Получить стили .
Вы можете оставить хеш для поиска, если маркер уже существует для данной ИКАО, создать маркер, если необходимо, или обновить его позицию. Что-то вроде:
function fetchData() {
return fetch("https://opensky-network.org/api/states/all")
.then((res) => {
return res.json();
})
.then((res) => {
return res.states.filter((state) => {
return (state[2] === 'France') && (state[5]) && (state[6]);
});
})
.catch((err) => {
if (err) throw err
});
}
function plotStates(map, markers) {
fetchData().then(function(states) {
states.forEach((state) => {
const lat = state[6],
lng = state[5],
icao24 = state[0];
if (markers[icao24]) {
markers[icao24].setLatLng([lat, lng]);
} else {
markers[icao24] = L.marker([lat, lng]);
markers[icao24].addTo(map);
}
});
setTimeout(() => plotStates(map, markers), 3000);
});
}
const markers = {};
plotStates(map, markers);
И демо
function fetchData() {
return fetch("https://opensky-network.org/api/states/all")
.then((res) => {
return res.json();
})
.then((res) => {
return res.states.filter((state) => {
return (state[2] === 'France')
&& (state[5]) && (state[6]);
});
})
.catch((err) => {
if (err) throw err
})
}
function plotStates(map, markers) {
fetchData().then(function(states) {
states.forEach((state) => {
const lat = state[6],
lng = state[5],
icao24 = state[0];
if (markers[icao24]) {
markers[icao24].setLatLng([lat, lng]);
} else {
markers[icao24] = L.marker([lat, lng]);
markers[icao24].addTo(map);
}
});
setTimeout(() => plotStates(map, markers), 3000);
});
}
var map = L.map(document.getElementById('map')).setView([48.8583736, 2.2922926], 4);
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: '© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors'
}).addTo(map);
L.marker([48.8583736, 2.2922926]).addTo(map);
const markers = {};
plotStates(map, markers);
html, body {
height: 100%;
margin: 0;
}
#map {
width: 100%;
height: 100%;
}
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.3.4/dist/leaflet.css"/>
<script src="https://unpkg.com/leaflet@1.3.4/dist/leaflet.js"></script>
<div id='map'></div>