I am using Mapbox Studio, customized a nice basemap, and downloaded it. It downloaded as a .json file with a couple thousand lines of code.

enter image description here

enter image description here

I want to be able to use this basemap (called basemap.json) in leaflet, like:

var basemap = L.tileLayer("data/basemap.json", {
maxZoom: 17,
minZoom: 9
}).addTo(map);

but that doesn't seem to work.

Any suggestions on how to load a custom Mapbox Studio basemap into leaflet?

  • Some more info: My goal is to make a custom basemap for use in my own project, without hosting it on MapBox's server. I basically just want custom tiles in a vector file format. Is that possible? Or do I need to make reference to my MapBox API in order to use/display the tiles? – kadenz Nov 24 '15 at 21:55
  • 1
    Have you had a look at this mapbox question which has the most votes? gis.stackexchange.com/questions/125037/… – raphael Nov 25 '15 at 1:02
  • The json style is for the Mapboxgl library I think. You need to add a GL layer (use this github.com/mapbox/mapbox-gl-leaflet) – sabas Nov 26 '15 at 13:54
  • Thanks. I'm still tinkering with different options, so I'll post an answer once I work it out. A follow up: is it free to self-host Mapbox Studio vector tiles? That's my main interest in exploring this option. Or, does one still need to include the API that tracks page views? – kadenz Nov 30 '15 at 20:34

So the json file you've got contains the styles to work with mapbox.gl which isn't the same as leaflet.

Mapbox have however put together a library to make mapboxgl stuff talk to leaflet. Documentation is pretty spare but look at the examples and hopefully that gives you a few ideas.

Regarding self-hosting vector tiles it is certainly possible, see this post and I've also thrown together a github repo which shows something similar.

Hope that helps, Rowan

Your Answer

 

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.

Not the answer you're looking for? Browse other questions tagged or ask your own question.