Years ago, mapping departments drew maps on transparent Mylar sheets. Painstaking work went into drawing those sheets at the same scale. When the Mylar sheets were stacked on top of each other, and corresponding points on each layer were lined up, they would provide a visual mashup of overlapping map layers.

Today, the same effect can be created with a browser-based map application. Instead of clear Mylar sheets, the application takes advantage of layering image files and vector graphics to create the same effect. In the ArcGIS JavaScript API, we refer to these stackable map data sources as layers.

The ArcGIS JavaScript API can accept multiple types of layer files from different sources. Some layers are very flexible, and can be realigned and reprojected to line up with other map sources. These are commonly referred to as dynamic layers. Other layers are made up of images drawn at specific scales, and are not designed to be so flexible. These are commonly referred to as tiled layers.

In our current application, the National Geographic background we added is considered a tiled layer. Its pre-rendered content loads quickly in the browser, which is one of the advantages of using a tiled layer. On the other hand, our data source for the census data is a dynamic layer provided by an ArcGIS Server map service. Its dynamic nature helps it to stretch and line up with our tiled background. Here's the code we'll use to add the layer:

var censusUrl = "http://sampleserver6.arcgisonline.com/arcgis/rest/services/Census/MapServer/";
var map = new Map("map", {
      basemap: "national-geographic",
      center: [-95, 45],
      zoom: 3
    });

var layer = new ArcGISDynamicMapServiceLayer(censusUrl);

map.addLayer(layer);

So, if we take a look at the page at this point, we should see a map of the world with black lines surrounding each state, census tract, and block. We can zoom in to see more detail in the map. Your map should look something like the following image: