Donggov

@donggov·3 public vizzes

Fork of Globe Zoom - Animate

This example visualizes global nuclear explosion locations on a geo-scatterplot with interactive globe projections. The visualization uses an animated globe that users can rotate and zoom between map projections, with points representing nuclear data positioned via d3.geoMercator projection. Built with D3 v3 and React, the code employs d3.geo.orthographic for globe rendering, d3.geo.zoom for transitions, and reads nuclear explosion data from a CSV file. The visualization also features graticules, land polygons from TopoJSON world atlas data, and tooltips via d3.tip.

May 30, 2022

Loading thumbnail…

Fork of Cheap Tricks for Interaction

This visualization displays a world map using a natural Earth projection, with countries colored in light green that turn red on hover. It supports zooming and panning through the d3.zoom behavior, which applies transformations to an SVG group element containing all geographic paths. The map is rendered with d3.geoPath and d3.geoNaturalEarth1, using TopoJSON and TSV data from the world-atlas package to associate country names with their shapes via tooltips. The code imports specific D3 modules and the topojson feature function to generate the geographic features.

May 30, 2022

Loading thumbnail…

Fork of Let's make a face with D3.js!

This example displays an interactive world map using a natural Earth projection, with country boundaries rendered as SVG paths on a spherical globe backdrop. The map supports panning and zooming through the D3 zoom behavior. It loads TopoJSON data from the world-atlas package, converts it to GeoJSON using the topojson feature method, and draws each country with geoPath while adding title tooltips showing country names. The code uses D3 v5 modules including geoNaturalEarth1, geoPath, and zoom.

May 30, 2022