Mapbox - How can I add a .pbf file as a Layer in Mapbox?

Question

I want to add a tile layer over my map in Mapbox. The tiles are hosted local with a php tileserver.

My previous attempt looks like this:

map.addLayer({
            'id': 'tiles',
            'type': 'fill',
            'Source': {
                'type': 'vector',
                'tiles': ['http://localhost/tileserver-php-master/{z}/{x}/{y}.pbf'],
            },
            'paint': {
                'fill-color': 'rgb(53, 175, 109)',
                'fill-outline-color': 'rgb(53, 175, 109)'
            }
        });

The tiles are individual polygons that should be placed over the map. The map is visible, but not the individual tiles.

A layer as geojson is not an option, since the file size is too big.

If I do it like this: map.addSource('tile', { type: 'vector', tiles: ['http://localhost/tileserver-php-master/{z}/{x}/{y}.pbf'], buffer: 0, maxzoom: 12 }); map.addLayer(…. It still appears the Error: layers.tiles: layer "tiles" must specify a "source-layer" — Daniel.fshr, Nov 12 '19 at 11:29
You've to specify a 'source-layer' for vector layers. Check this out: https://docs.mapbox.com/mapbox-gl-js/style-spec/#layer-source-layer Usually for tileserver-php, the layer name is same as the file you're serving. — Manish, Nov 12 '19 at 11:52

score 0 · Accepted Answer · answered Nov 11 '20 at 07:03

@Henhuy You can host your tiles as .mbtiles with: https://github.com/maptiler/tileserver-php. There you will also see the names of the source layers.

map.addLayer({
        'id': 'uniqID',
        'type': 'fill',
        'source': {
            'type': 'vector',
            'tiles': ["LINK_TO_TILESEVER.pdf"],
        },
        'source-layer': "SOURCE_LAYER_ID",
});

Mapbox - How can I add a .pbf file as a Layer in Mapbox?

1 Answers1