block by bmershon 82a8c2fd343b019becf6

Nevada Wilderness

Full Screen

A map of Nevada’s wilderness areas. See how the combined.json was built from government shapefiles to create this static graphic for web and print use.

You give the map instance a topojson object that looks like this:

objects: [
          nv: Object
          Basin: Object
                .
                .
                .
          wilderness: Object
         ]

Once you’ve (asynchronously) loaded a json file containing all the features you want (and maybe some you will ignore), you can call draw(data) on the map instance. The options object passed to the “atlas” constructor has a property layers.

layers is an array of layer definitions that each specify an object on the topojson object you want to render, what classes and ids to give that layer, as well as what interactions (“click”, “mouseover”) or lifecycle events (“enter()”, “update()”, “exit()”) you would like to explicitly set for each layer of topojson features.

In this particular example, we have chosen to use a null projection, because the topojson object coming from combined.json already has baked-in screen coordinates for a 960px x 500px SVG.

index.html

app.js