Howto build a custom map of collaborators with D3js

First of all go to https://bost.ocks.org/mike/map/ if you need learn how to build the map paths to use with D3js.

The start point of this project it was an static SVG where is defined the theme that we use.
Next step it was buid one list with the names and GPS of all Collaborators. I builded an CSV and then convert it to json with PHPOffice.
Then we just load the map and collaborators data and draw the world map the with collaborators points.

I think there isn't need more explanation, so see code here and demo here.

References
http://bost.ocks.org/mike/map/

Book
https://www.dashingd3js.com/d3-resources/d3-books

Maps API
https://github.com/mbostock/d3/wiki/Geo
https://github.com/mbostock/d3/wiki/Geo-Projections#mercator

Map locations Resources
http://www.diva-gis.org/gdata
http://www.gdal.org/drv_csv.html
http://gothos.info/links-data/
http://www.naturalearthdata.com/downloads/50m-cultural-vectors/

 

Free Tags: