Advanced GIS

In-class Exercise

Part 1: Creating styles with Mapbox

  1. Create an account with Mapbox if you don't already have one.
  2. Go to Styles and create a new style. When picking a template style, start with anything but the Satellite Streets template. Basic is fine for this activity.
  3. Consider what kind of features you want to highlight on your map try to highlight those features, optionally considering how your final project data would look on top of the basemap you are making.
  4. Edit the style. Attempt to change various properties in components and in specific layers.
  5. Answer the questions in today's outline under Mapbox Studio.

Part 2: Using Mapbox styles in Carto

  1. Publish your style from Part 1.
  2. Click the Share button once you publish it, then select Third party and CARTO.
  3. Copy the URL next to Integration URL.
  4. Open a Carto map.
  5. Click on the base map (the bottom layer).
  6. Under Source scroll over to and click Mapbox, then click the + under Style and paste the url you copied from Mapbox under the Mapbox tab.
  7. Click Add basemap and your basemap from Mapbox should appear.
  8. Publish your Carto map and add a link in today's outline under Using Mapbox Styles in Carto.

Part 3: Using Mapbox styles in JavaScript

  1. Copy the same basemap URL from Mapbox as you did in Part 2.
  2. Edit a Glitch site with a Carto map made in JavaScript, using this one if you need one.
  3. In JavaScript, use the URL from Mapbox on the line starting with L.tileLayer.
  4. Confirm that your Mapbox style is visible as the basemap.
  5. Add a link to your Glitch site in today's outline under Using Mapbox Styles in Leaflet.

Part 4: Adding your own data to Mapbox

  1. Download today's data.
  2. From your Mapbox dashboard, go to Tilesets > New Tileset and upload the disputed-areas zip file in today's data.
  3. Continue with your style from earlier or create a new one.
  4. While editing your style, click + in the top of the Layers tab, then click the Source button. Find and click on the data you uploaded under Unused sources.
  5. Click Style and style the layer.