Get/list source-layers from Mapbox GL JS vector source

Question

In Mapbox GL JS I am adding a vector tile source from a locally hosted mbtiles file. Adding this source to my map instance is easy like below.

map.addSource("polylinesSource",{
      "type":"vector",      
      "tiles": [
       "http://localhost:8000/polylinesJoined/{z}/{x}/{y}.pbf"
      ]
    })

The source-layers from this service will be dynamic and I am hoping for a way to reference all those layers once the source is loaded. Is it possible to list all the layers in a source once loaded?

Steve Bennett · Accepted Answer · 2020-05-04 10:29:44Z

3

This is surprisingly fiddly to do. Mapbox-GL-JS doesn't expose any methods to list the vector tile source layers available within a tileset.

I built vector inspector to solve this exact problem. The code here shows you the process for extracting that information from a .pbf: https://github.com/stevage/vector-inspector-api/blob/master/server.js

Alternatively, since you have the local mbtiles file, another option is to extract it locally. Using another tool I built, tileinfo.

Also, if you serve the tiles using something like tessera you can access the layers info directly at the TileJSON endpoint.

answered May 4, 2020 at 10:29

Steve Bennett

130k45 gold badges188 silver badges247 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

james Over a year ago

where in your tileinfo tool can i see the source layer info? I'm trying to render the map but I don't know where I can find the source-layer of my tileset. Not sure if the wrong source-layer is the reason why my tiles aren't rendering.

Collectives™ on Stack Overflow

Get/list source-layers from Mapbox GL JS vector source

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related