Skip to main content
Log in
J

jessie.xie2023@gmail.com

@jessie-2023·3 public vizzes

Loading thumbnail…

Fork of Polished World Map

A polished world map visualizes country boundaries and graticules using the Natural Earth projection. Rendered with React and SVG, it loads World Atlas TopoJSON data and converts it to GeoJSON via `topojson.feature` and `topojson.mesh`. The map uses `d3.geoNaturalEarth1` and `d3.geoPath` to draw land, interiors, and grid lines, with custom CSS styling for the sphere, landmasses, and stroke colors.

Feb 13, 2025
Loading thumbnail…

Fork of Missing Migrants Date Histogram

This histogram visualizes the monthly total of dead and missing migrants, drawn as SVG rectangles within a React application. Each bin aggregates the sum of the "Total Dead and Missing" column from the Missing Migrants Dataset, using the d3.bin function to create monthly time buckets and d3.sum to accumulate values. The chart's axes use d3.scaleTime and d3.scaleLinear, with tick grids and labels styled via CSS. Hovering over a bar reveals its exact total through a tooltip.

Feb 12, 2025
Loading thumbnail…

Fork of Polished World Map

This example displays a polished world map using the Natural Earth projection, showing landmasses in teal, graticules, and country boundaries. It renders a sphere, graticule grid, land features, and interior borders using React with SVG elements. The code leverages `geoNaturalEarth1`, `geoPath`, and `geoGraticule` from d3, and loads World Atlas TopoJSON data via `topojson.feature` and `topojson.mesh`. A CSS stylesheet applies the custom color scheme.

Feb 7, 2025