Skip to content

Instantly share code, notes, and snippets.

@davewalk
Last active June 15, 2018 18:58
Show Gist options
  • Save davewalk/5893611 to your computer and use it in GitHub Desktop.
Save davewalk/5893611 to your computer and use it in GitHub Desktop.
Using Stamen map tiles in Leaflet without loading the tile.stamen.js file
var tonerUrl = "http://{S}tile.stamen.com/toner/{Z}/{X}/{Y}.png";
var url = tonerUrl.replace(/({[A-Z]})/g, function(s) {
return s.toLowerCase();
});
var basemap = L.tileLayer(url, {
subdomains: ['','a.','b.','c.','d.'],
minZoom: 0,
maxZoom: 20,
type: 'png',
attribution: 'Map tiles by <a href="http://stamen.com">Stamen Design</a>, under <a href="http://creativecommons.org/licenses/by/3.0">CC BY 3.0</a>. Data by <a href="http://openstreetmap.org">OpenStreetMap</a>, under <a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY SA</a>'
});
basemap.addTo(map);
// Check out the tile.stamen.js file for which options you have to pass depending on the style and mapping library
@niahoo
Copy link

niahoo commented Mar 17, 2018

I don't understand why you replace all '{S}', '{X}', etc. with lowercase instead of directly write them in lowercase in tonerUrl ?

Thank you very much for the code, very useful.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment