How to convert and prepare TopoJSON files for interactive mapping with d3

Richard Zimerman
Mar 20, 2017 · 4 min read

World maps

One of the first maps you may want to get your hands on is the world map. A great resource for this is Natural Earth, a public domain map dataset available at 1:10m, 1:50m, and 1:100 million scales. For each scale (level of detail), Natural Earth provides cultural, physical, and raster maps.

Step 1 — Getting a map

Select your preferred map according to level of detail (1:10m, 1:50m, and 1:100m) and category (cultural, physical and raster). When building maps for the web the level of detail is important as it will impact file size and rendering speed significantly, especially when rendering maps with SVG.

Step 2 — Choosing what to use

The downloaded folder will contain a number of files with different extensions such as .dbf, .prj, .shp, and .shx. To convert the shapefile into TopoJSON, you will need the .shp file, as well as a .dbf file (in case it’s available).

Step 3 — Import the shapefiles into mapshaper

To convert shapefiles into TopoJSON, you can use mapshaper, a tool for shape simplification and conversion from one geo format to another. It supports Shapefiles, GeoJSON and TopoJSON formats. While mapshaper can be used on the commandline, the online tool also provides a nice visual interface for the simplification process.

Once you import the .shp and .dbf files into mapshaper you should see a preview of the map.

Step 4 — Optional step: Simplify your map

The simplify option allows you to adjust the level of detail by dragging a slider. The more you simplify the less precision and detail you will have in your final map. A simplified map will be smaller and often simplifying a map (sometimes even by 50%) will not result in any visible loss of detail.

Step 5 — Exporting your TopoJSON map

Once you are happy with the level of detail on your map, export your map as a TopoJSON file. You’re done!

Country level and lower administrative level maps

World maps are great, but sometimes you want to visualize a more detailed view of a particular region, country, or even a more specific administrative area. If you are doing non-commercial work, one great resource for individual country shapefiles is the Global Administrative Areas website.

HackerNoon.com

how hackers start their afternoons.

Richard Zimerman

Written by

Co-founder and web developer at http://www.zcreativelabs.com

HackerNoon.com

how hackers start their afternoons.