Mapbox Multiple polygons from single geoson source

Question

Using Mapbox JS I'm trying to draw multiple polygons from a single Geoson source. I'm following the tutorial for multiple geometries from one Geoson source (Mapbox link) combined with the realtime data documentation (Mapbox link). However, I get no polygon drawn on the map. Is the FeatureCollection the right approach for drawing and updating multiple polygons? The number of polygons can vary in time, as well.

Withing the map.on('load'...), I got this source, layer and data loading:

map.addSource('fire', { type: 'geojson', data: fire_url });
/*
        map.addLayer({
        'id': 'fire',
        'type': 'fill',
        'source': 'fire',
        'paint': {
        'fill-color': '#888888',
        'fill-opacity': 0.4
        },
        'filter': ['==', '$type', 'Polygon']
        });


        window.setInterval(function() {
            console.log('got data');
            map.getSource('fire').setData(fire_url);
        }, 1000);

Example of data I'm updating live:

{
  "features": [
    {
      "geometry": {
        "coordinates": [
          [
            -8.318497, 
            39.954263
          ], 
          [
            -8.317997, 
            39.954263
          ], 
          [
            -8.317997, 
            39.959263
          ], 
          [
            -8.318497, 
            39.954263
          ]
        ], 
        "type": "Polygon"
      }, 
      "properties": {}, 
      "type": "Feature"
    }
  ], 
  "type": "FeatureCollection"
}

Steve Bennett Steve Bennett · Accepted Answer · 2019-12-18T23:42:14

Your GeoJSON is invalid. You can test it at http://geojsonlint.com/

Polygons are not just arrays of points (like LineStrings). They are arrays of arrays of points, because there can be holes and islands within the outer polygon.

Mapbox Multiple polygons from single geoson source

1 Answers