Seem to be having problems adding a geojson featurecollection to Mapbox GL JS.

What is the most efficient way to accomplish this? I've looked through the examples given on their site but they involve only singular objects.

Edit: I've managed to display the geojson using the following code but it remains as one collective polygon and not individual squares like they were exported as.

map.on('style.load', function() {
map.addSource("tom", {
    "type": "geojson",
    "data": mappingStructure
});

map.addLayer({
    'id': 'foobar1',
    'type': 'fill',
    'source': 'tom',
    'interactive': true,
    'paint': {
        'fill-color': '#ffffb2',
        'fill-opacity': 0.8,
     },
});

Seem to be having problems adding a geojson featurecollection to Mapbox GL JS.

What is the most efficient way to accomplish this? I've looked through the examples given on their site but they involve only singular objects.

Edit: I've managed to display the geojson using the following code

map.on('style.load', function() {
map.addSource("tom", {
    "type": "geojson",
    "data": mappingStructure
});

map.addLayer({
    'id': 'foobar1',
    'type': 'line',
    'source': 'tom',
    'interactive': true
});

Seem to be having problems adding a geojson featurecollection to Mapbox GL JS.

What is the most efficient way to accomplish this? I've looked through the examples given on their site but they involve only singular objects.

Seem to be having problems adding a geojson featurecollection to Mapbox GL JS.

What is the most efficient way to accomplish this? I've looked through the examples given on their site but they involve only singular objects.

Edit: I've managed to display the geojson using the following code but it remains as one collective polygon and not individual squares like they were exported as.

map.on('style.load', function() {
map.addSource("tom", {
    "type": "geojson",
    "data": mappingStructure
});

map.addLayer({
    'id': 'foobar1',
    'type': 'fill',
    'source': 'tom',
    'interactive': true,
    'paint': {
        'fill-color': '#ffffb2',
        'fill-opacity': 0.8,
     },
});