Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

88
Vistas
Update FeatureCollection Geojson coordinates to mapbox map every 2sec

I am new to Javascript and mapbox and I want some help to solve an issue (code below). I am using some coordinates ({{coords}}) coming from a python script and I am adding them as a geojson to the map (featureCollection). I want these geojson coordinates to be updated every 2 seconds. I have used setData(), but my coordinates are not refreshing on the map. Can you help and give some hints? Thank you very much.

var longLat = {{coords}};
var featureCollection = [];

for(var itemIndex in longLat) {
featureCollection.push({
    "type": "Feature",
    "geometry": {
      "type": "Point",
      "coordinates": longLat[itemIndex]
    },
    "properties": {
      "title": "boat",
      "icon": "ferry"
    }
  });
}
map.on('load', function () {

map.addSource('ship', { type: 'geojson', data: featureCollection });
  map.addLayer({
    "id": "points",
    "type": "symbol",
    "source": {
    "type": "geojson",
      "data": {
        "type": "FeatureCollection",
        "features": featureCollection
      }
    },
    "layout": {
      "icon-image": "{icon}-15",
      "text-field": "{title}",
      "text-font": ["Open Sans Semibold", "Arial Unicode MS Bold"],
      "text-offset": [0, 0.6],
      "text-anchor": "top"
    }
  });

window.setInterval(function() {

  map.getSource('ship').setData(featureCollection);
}, 2000);

});
about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

You didn't use 'ship' source for the layer, so updating source data (map.getSource('ship').setData) wouldn't trigger rerender.

Change the source property of map.addLayer(...), Try map.addLayer({...,source:'ship'})

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda