Javascript 如何使用传单在openstreetmap上移动标记？

我正在使用一个API，它提供了实时的飞机位置

对于传单，我使用纬度和经度在地图上显示每个平面的标记。每次脚本刷新时，我希望在创建新标记时移动标记

setInterval(() => {
fetch("https://opensky-network.org/api/states/all")
    .then((res) => {
        return res.json();
    })
    .then((res) => {

            for (let i = 0; i < res.states.length; i++) {
                if (res.states[i][2] == 'France') {
                    if (res.states[i][5] != null || res.states[i][6] != null) {
                        posA = res.states[i][5];
                        posB = res.states[i][6];
                        marker = L.marker([posB, posA]);
                        marker.addTo(mymap);
                    }
                }

            }


    })
    .catch((err) => {
        if (err) throw err
    })
}, 3000);

---

您可以保留一个散列以查找给定ICAO的标记是否已存在，必要时创建标记或更新其位置。比如：

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);

还有一个演示

函数fetchData（）{
返回取回（“https://opensky-network.org/api/states/all")
。然后（（res）=>{
返回res.json（）；
})
。然后（（res）=>{
返回res.states.filter（（状态）=>{
返回（状态[2]=“法国”）
&&（州[5]）和&（州[6]）；
});
})
.catch（（错误）=>{
如果（错误）抛出错误
})
}
功能绘图状态（地图、标记）{
fetchData（）.then（函数（状态）{
states.forEach（（state）=>{
常量lat=状态[6]，
液化天然气=状态[5]，
icao24=状态[0]；
如果（标记物[icao24]）{
标记物[icao24].setLatLng（[lat，lng]）；
}否则{
标记物[icao24]=L.标记物（[lat，lng]）；
标记[icao24]。添加到（地图）；
}
});
setTimeout（（）=>plotStates（映射、标记），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'{
属性：“©；贡献者”
}).addTo（地图）；
L.标记（[48.8583736,2.2922926]）添加到（地图）；
常量标记={}；
绘图状态（地图、标记）
html，正文{
身高：100%；
保证金：0；
}
#地图{
宽度：100%；
身高：100%；
}


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);