As you saw with ArcGIS Server, online base maps can have dozens of layers, with all kinds of rules about what zoom levels they are hidden and displayed; therefore, we’re not going to start from scratch. Instead, we’ll start with existing Mapbox basemaps (which are pretty well designed to begin with) and make small modifications to fit our taste.
First, please download the data for these lesson 5 exercises. After you download the data, unzip it.
We’ll start out simple by infusing some of our own data into one of the Mapbox basemaps. We’ll then view our creation in ArcMap, where you already know how to add more layers on top.
Suppose you’re examining nighttime safety in the Washington DC area. You want to understand where activities are occurring at night relative to existing street lighting. The “Dark” basemap offered by Mapbox looks appealing for your purposes, but you want to integrate a layer showing areas that are illuminated. You plan on eventually doing some visualization of street vendor activity, pedestrian patterns, crimes, and other happenings in relation to the street lighting.
For the best user experience, you should complete the following steps on a desktop computer (not a tablet or phone):
- Open a web browser to Mapbox.com, click Products > Studio and click Get Started.
- If you haven't done so, make up a username, e-mail address, and password and click Start By Designing a Map after you log in.
- This takes you into Mapbox Studio. Following the model of most software as a service offerings, this tool runs directly within the web browser (previously you had to install a tool on your desktop). It allows you to choose colors, text, and symbol weights to be used in a basemap. The base data is from OpenStreetMap, although you can also load in your own layers.
- Click the More Options button under Styles.
- Click the Create button in the Dark style.
- Click the pencil icon (you need to hover over it to see it) and rename your style Street Lighting instead of the default name Dark.
- Zoom your map into the central area of Washington DC.
This map looks great, but wouldn’t it be nice if we could add the areas illuminated by street lights in a soft yellow glow? Let’s do that. First, we’ll need to upload our data.
- On the upper-left side of Mapbox Studio, click the Go Back icon and then select the Tilesets menu.
Tilesets are the vector tiles that Mapbox uses to encapsulate data displayed on the web. They’re very different from the rasterized tiles you worked with in ArcGIS Server. You can upload a vector dataset like a shapefile, and Mapbox will turn it into vector tiles, which it then hosts on its servers. You don’t ever really work with the tiles directly, but you can define styling rules to dictate how they should look. These styling rules can be changed on the fly because they are not “burned into” the tiles as they are with rasterized tiles.
- Click New Tileset and upload the light_areas.zip shapefile included in this lesson. I derived this from a dataset of street light locations and wattage that I obtained from the Open Data DC website. The lighted areas are just variable distance buffers based on a very unscientific mathematical formula (ie., I made it up) based on the wattage of the light.
- When it's done loading, navigate back to your StreetLighting basemap and return to the style editor window.
- Click the Add Layer button and select your new lights layer as the Source.
- In the layer list on the left hand side, drag and drop your light-areas layer so that it is underneath all labels and boundaries.
- Click your light-areas layer and modify its color to a bright yellow with an opacity as 0.5 and no antialiasing as shown in the image below. This gives the street lights a soft glow.
- In the upper right of your screen, click the Publish style button and confirm you want to do this by clicking Publish again (not Publish as new).
- On the upper-left side of Mapbox Studio, click the Go Home icon and then and click Share and Use in your style's menu.
- Switch to the Use menu, click Third Party, and copy the URL under WMTS.
ArcMap is more wired to connect to servers rather than individual layers. This becomes an issue with tiled datasets, which are usually just hosted on a web endpoint with no need to do any special communication with a server. One way around this is to use a WMTS (web map tile service) which is an open specification for serving map data over the web via tiles. ArcMap has a user interface for making connections to WMTS services.
- Open ArcMap (on your own computer or on your EC2 instance, if you have licensed it).
- In the Catalog window, find the GIS Servers item and click Add WMTS Server.
- In the URL box, paste the WMTS endpoint that you copied from the Mapbox site.
- Click OK. It’s going to ask you for a name and password, but just click Cancel as many times as you need to in order to dismiss those messages.
- In the Catalog tree, you should now see an item called Mapbox on api.mapbox.com. It might have a little red x on it. That means it’s not connected. Double-click the item to make a connection.
- Expand your connection to Mapbox on api.mapbox.com and find your StreetLighting layer. Drag and drop it into the ArcMap table of contents.
- Zoom in to Washington DC. As you get close, you should see your street lights layer appear.
Hooray! You now have your Mapbox map as a basemap in ArcMap. Now you could do other kinds of visualization and analysis on top of that layer.
- Just for fun, add your sidewalk_vendors.shp shapefile (included with this lesson’s data) as a layer in ArcMap. I also obtained this from opendata.dc.gov. It contains the locations of registered street vendors in Washington DC.
- Style and label the street vendors in such a way that you can get an idea of which ones are surrounded by lots of lighting and which ones are in the darker areas.
To recap, you took an existing Mapbox-designed basemap and fused in some of your own data. You then brought this into ArcMap so you could work with it as a basemap. The next walkthrough will go beyond this, showing you how to modify the Mapbox design, create your own thematic data, and view your creations on the web.