Map Visualization of (office locations in) The Netherlands -using GeoJSON, D3 and SVG

The combination of GeoJSON data sets and the JavaScript d3.js for SVG visualizations is quite valuable for creating rich and interactive visualizations of data that is related to geography (regions, countries, states, provinces, cities etc.). In this article I will apply this powerful combination to The Netherlands, the country I live in. I will find a GeoJSON file with data for the 12 provinces in The Netherlands and visualize the country with its provinces using d3.js in a simple web application. Then I will markers for the location of the offices of the Conclusion companies (Conclusion is the ecosystem of companies for which I serve as CTO).

In several recent articles on Data Visualization using a Thematic World Map with color shades assigned to countries based on their value for a specific property in a world data set I have introduced the use of d3.js library for browser based visualization using SVG in combination with the GeoJSON data format in which many geographical definitions are available, from countries and states to cities, lakes and forests. I have shown how we can easily make the map switch between different properties and how we can add some degree of interactivity (allowing countries to be selected by clicking on them and changing the rotation or horizontal / east-west translation of the map. In a fourth article I discussed zooming in (and then out again) in two different ways: programmatically and user initiated.

In this article I take what I created in those earlier articles and apply it to data regarding The Netherlands.

Visualizing The Netherlands

The first step in visualizing a part of the world with d3.js obviously is finding the GeoJSON file that provides the geographic information. With a little searching, I found the Cartomap GitHub repository that contains many useful GeoJSON files that provide geographic information for different regional systems — such as courts of justice, fire service, labor market, tourism, health, municipality, urban areas, youth, chamber of commerce, agriculture, utilities, police, province, ressort, neighbourhood, safety regions. Most files are available for many different years.