In this tutorial, we will use the sensing capacity of our devices to make GPS drawings, an activity with a rich precedent including You Are Here by CSR's Laura Kurgan, Amsterdam Realtime by Esther Polak and Jeroen Kee, and drawings by Jeremy Wood. Contemporary devices and Mapbox's API make it straightforward for us to get similar results to what was technically very challenging at the time these works were made.

In the previous tutorial, we created markers using Mapbox GL JS by declaring them explicitly in our code. Our basemap data came from Mapbox's defaults, which in turn come from OpenStreetMap. In this tutorial, we will create a tileset using external data. Just like QGIS, Mapbox can add layers from vector, raster, and point-based information. Unlike QGIS, which works with maps at a single level of detail, Mapbox converts data to tiles which are delivered to the browser as they are needed. The data in each tile is limited to a bounded geographic area and zoom level, the result of which is that certain things can be visualized only at relevant times, rather than everything needing to be visualized all at once. This allows for the kind of interactivity we have come to expect from web maps, and it also allows us to make local calculations about the user's position in relation to data. The theme of this tutorial will be a classic element of NYC life.

We are going to be making web maps using Mapbox GL JS. This is a recent javascript library that uses WebGL to render interactive maps from vector tiles (as opposed to raster tiles) created with Mapbox Studio. Data for these maps comes from OpenStreetMap.This tutorial will introduce you to the basic setup and what it feels like to develop for a web browser. This will be a very different approach than our experience with QGIS, and it is much more prone to error given the number of new concepts and syntaxes involved. Brackets, commas, quotes, and colons... stay with it—it's ok if you dont understand what everything is doing at first.