This project plots meteorite strikes across the globe. Each strike is marked by a circle sized and coloured to represent the meteorites relative mass. Addition information, such as the date it fell, is shown on a mouse-over (or touch) tool tip. The map can be zoomed and panned using the touch or mouse gestures (pinching and dragging). I used the D3.js library and used map data from the Natural Earth project. The project is a data visualization challenge from the freeCodeCamp curriculum.
Download meteorite strike GeoJSON data from freeCodeCamp and download world map countries data file from Natural Earth
unzip -o ne_50m_admin_0_countries.zip
npm install -g shapefile
shp2json ne_50m_admin_0_countries.shp -o ne_50m_admin_0_countries.json
npm install -g ndjson-cli
ndjson-cat meteorite-strike-data.json > meteorites.json
npm install -g d3-geo-projection
geoproject 'd3.geoCylindricalStereographic()' \
< ne_50m_admin_0_countries.json \
> countries_scaled.json
geoproject 'd3.geoCylindricalStereographic()' \
< meteorites.json \
> meteorites_projected.json
ndjson-split 'd.features' \
< countries_scaled.json \
> countries_scaled.ndjson
ndjson-map 'd.properties = {Country: d.properties.NAME }, d' \
< countries_scaled.ndjson \
> countries_only.ndjson
ndjson-reduce \
< countries_only.ndjson \
| ndjson-map '{type: "FeatureCollection", features: d}' \
> countries_only.json
npm install -g topojson
geo2topo \
strikes=meteorites_projected.json \
world=countries_only.json \
> world-meteorite-strikes.json
Set the map projection to d3.geoCylindricalStereographic