Is it possible to get all layers and/or metadata from a Mapbox GL source?

Question

In a mapbox-gl map, given the source:

map.addSource('myTileSource', {
    type: "vector",
    tiles: "url to source tiles.pbf",
});

is it possible to get all the layers and/or metadata for the tiles inside that source? This is possible in node with node-mbtiles, but wondering if it is possible directly in mapbox-gl via javascript? Something like map.getLayersFromSource would be awesome.

Answer 1

Since you have a .MBTiles file you can use TileServer GL to serve up your data. This tiny web server has a mode called Inspect or X-Ray which will sniff the vector layers in the .MBTiles and display a basic style so you can see the data.

TileServer GL uses Javascript to show the vector data available at each zoom level. It also has a mouse event handler to show you the metadata of each feature.

After installing tileserver-gl or tileserver-gl-light you can then navigate to the Inspect mode by navigating to

• http://localhost:8080/data/osm2vectortiles/

See this link for more information on how to install

• How to install TileServer GL Light - https://github.com/klokantech/tileserver-gl/blob/master/README_light.md
• Javascript of how the Inspect view is built — https://github.com/klokantech/tileserver-gl/blob/master/public/templates/data.tmpl
• If you only have .pbf, then you can use mb-util to create .MBTiles.

Example of Inspect mode from TileServer GL

Answer 2

There is a bit of ambiguity in your question, but if your question is "list all Mapbox GL JS layers for a given source ID", you can iterate through all the layers in a Mapbox GL map and filter out anything that doesn't match the source name:

map.getStyle().layers.filter(i => i.source === 'myTileSource')