CODEWITHSUNDEEP
mapboxgeomapbox-gl-jsvector-tiles
iskandarblue
iskandarblue

Reputation: 7526

Adding vector tiles to mapbox.js

Mapbox JS has an extensive library of examples here, but what is missing is documentation on how to load vector tiles from Mapbox Studio.

In the upgraded Mapbox GL JS, this is clearly explained in the documentation. 

map.addLayer({
    "id": "terrain-data",
    "type": "line",
    "source": {
        type: 'vector',
        url: 'mapbox://mapbox.mapbox-terrain-v2'
    },
    "source-layer": "contour",
    "layout": {
        "line-join": "round",
        "line-cap": "round"
    },
    "paint": {
        "line-color": "#ff69b4",
        "line-width": 1
    }
});

Where the url contains the mapid and the source-layer is the name of the layer. So if mapid = abcd1234, my username is testUser, and my vector layer name is testLayer I would write:

"source": {
    type: 'vector',
    url: 'mapbox://testUser.abcd1234'
},
"source-layer": "testLayer",

This works perfectly in Mapbox GL JS, but what would the equivalent example be for loading mapbox vector tiles from Mapbox Studio in Mapbox JS?

Upvotes: 0

Views: 632

Answers (1)

Malcolm
Malcolm

Reputation: 473

Assuming Mapbox JS is based on Leaflet 1+, then you can use http://leaflet.github.io/Leaflet.VectorGrid/vectorgrid-api-docs.html. Actually I find this plugin + Leaflet/Mapbox JS has certain advantages over gl js.

Upvotes: 1

Related Questions