Using Stamen and MapBox tilesets as basemaps in ArcGIS.com

In his recent blog entry Adding tile layers to your web map, Chris Whitmore explained how the March 2013 enhancement to ArcGIS Online supported the addition of a range of new file types to web maps. Chris described the approach of adding tile layers to web maps which allows you to use web-accessible map tiles from a server directly using a URL request from the browser. In this blog entry I show you how this approach can be used to integrate Stamen and MapBox tilesets in your ArcGIS Online web maps.

A map tileset is simply a set of images stored on a web server which can be accessed directly. Since tilesets are not referenced as a service, the key to adding them to your web map is to know the URL of the tileset you want to use. Most tilesets will follow the same standard so that the URL ends in /{z}/{x}/{y}/.[image format] where {z} is the zoom level parameter, {x} is the x coordinate parameter and {y} is the y coordinate parameter. Chris used the OpenCycleMap tileset which illustrates the standard URL array:

http://{subDomain}.tile.opencyclemap.org/cycle/{level}/{col}/{row}.png

In order to use a tileset from another provider in ArcGIS Online you first need to discover the URL for the tileset you want to use. Sometimes the provider will publish the URL on their web site, like Stamen. Alternatively, with a little exploratory work you can discover the URL from the web browser. Let’s see how this works with Stamen’s Watercolor tileset.

Step 1. Load the original map viewer. Stamen Watercolor is at maps.stamen.com/watercolor

Step 2. Right-click in the browser window and select Inspect element

Inspect element

Step 3. Select the Resources tab and then navigate to the folder that contains the individual tiles and select a tile file

Tile file

The individual tile will contain the URL in the standard format. Note it down. This is what you will need in order to use the tileset in ArcGIS Online.

In the example above, you’ll notice that the sub domain is <a>. If you explore some of the other images in the folder you’ll likely find other sub domains used (e.g. b, c, d). These are simply the sub domain location for the particular tile with the complete tileset shared across multiple servers.

So the Stamen Watercolor tileset URL information you require is:

http://{subDomain}.tile.stamen.com/watercolor/{level}/{col}/{row}.jpg

sub domains a, b, c, d

Now you’re ready to add Stamen’s Watercolor tileset into ArcGIS Online using the Add Layer from Web option that Chris outlined in his blog. The Add Layer from Web dialog box should look like this:

Add layer from web

Note that the credits information is completed fully. It is important to ensure that you abide by the terms of service of the original tileset provider and give proper attribution. If you are in any doubt as to the attribution required, contact the original tileset provider.

You can either build your own web maps using this method or, alternatively, the Stamen Watercolor, Toner and Terrain tilsets are all available in the Stamen basemaps group on ArcGIS online.

It is also permissible to publish any custom maps from your MapBox account in ArcGIS Online.  The process is the same, except the URL must reference your MapBox account and the Map ID. Let’s say my MapBox  username is <kennethfield> and the Map ID I want to use is <b34d0wdj>, then the URL and sub domain information I require to add a tileset into ArcGIS Online is as follows:

http://{subdomain}.tiles.mapbox.com/v3/kennethfield.map-b34d0wdj/{level}/{col}/{row}.png

sub domains a, b, c, d

Attribution for MapBox tilesets: Data © OpenStreetMap contributors. Design © MapBox.

An example Mapbox tileset used as an ArcGIS Online basemap inside an Application template can be seen here

MapBox Streets

Adding tile layers from other providers gives you even more flexibility in styling your ArcGIS Online web maps. In addition to Esri basemaps, you can now make use of the free basemaps from Stamen. You may also have authored and published maps using MapBox and TileMill which you can now reference in ArcGIS Online web maps as an alternative basemap. This gives you considerable flexiblity in styling your basemaps and ensuring they suit the purpose of the map theme or story you are illustrating. Get creative!

This entry was posted in ArcGIS Online, Mapping, Story Maps, Web and tagged , , , , , , , . Bookmark the permalink.

Leave a Reply

7 Comments

  1. stephensmithaot says:

    It would be awesome if we could load the Stamen maps directly into ArcMap. The “Open in ArcGIS Desktop” option doesn’t seem to work. Could you write a little about the best way to integrate other basemaps into ArcMap? Thanks.

  2. jhchan69 says:

    same here. None of the “.pkinfo” files that I downloaded from http://www.arcgis.com/home/group.html?owner=cartogeek&title=Stamen%20basemaps seem to be recognized by ArcMap, ArcCatalog nor Windows Explorer.

    Can anyone help?

    I found a passing reference to .pkinfo in the forums saying that it is supported in Arc 10-1 but I couldn’t find any mention of .pkinfo in the help files

  3. dmajka1 says:

    The ArcBrutile extension will load the Stamen maps into ArcGIS Desktop, though in my experience, you have to be careful with it, because sometimes annotation disappears when using the extension.

  4. jhboyle says:

    THis is great, I love the design styles!

    one question, is it possible to add these to a Portal for ArcGIS instance or will we need to wait a patch or 2?

  5. carlynne says:

    Hi,I am not getting a subdomain options when I add layer from the web. As a result, I get the image tile duplicated when it’s imported. Also, I think the Stamen Map interface may have changed a bit since this post, as I don’t see a “resources” tab when I “inspect element.”

    Thanks for tsharing this resource.

  6. pattyjula says:

    Great explanation! I had been stuck on the {level}/{col}/{row} for a few days, but now I understand. THANKS!