Skip to main content
SimilarExport ZIP
100%

React world map + migrant death/missing points + histogram

✓ Published1🌍 Public
SSuperShreejit
Last edited May 17, 2022
Created on May 16, 2022

This visualization combines a world map with a histogram of migrant deaths and missing persons. The map uses a D3 natural Earth projection with SVG paths for land, borders, and graticules, overlaid with circles scaled by the square root of the reported deaths. Below, a time-based histogram bins monthly totals using d3.bin and displays them as rectangular bars. Data is loaded from CSV and TopoJSON sources, rendered with React, with tooltips showing counts and dates.

AI-generated description

A react World Map chart + migrants of world map: topo-json data and migrants: data

MIT Licensed

Similar vizzes

Loading thumbnail…

React world map + migrant death/missing points + histogram with brush

This React visualization combines a natural Earth projection world map with migrant death and missing person data, plotted as scaled circles whose radius encodes the total count. A linked histogram below displays the monthly distribution of deaths, featuring a brush filter that dynamically updates the map’s displayed points based on the selected date range. The code uses d3.geoNaturalEarth1, d3.geoPath, d3.geoGraticule, d3.scaleSqrt, d3.bin, d3.brushX, and d3.timeMonths, rendering SVG elements with topojson world atlas data and CSV migrant records.

SSuperShreejit
95% match
Loading thumbnail…

React world map + migrant death/missing points

A React-based world map displays migrant deaths and missing persons as semi-transparent circles, sized using a square-root scale to encode the reported total per location. The natural Earth projection renders geographic landmasses and graticules via `d3.geoPath`, with topojson world-atlas data providing country boundaries. Circle positions derive from parsed CSV coordinates, while hover tooltips reveal the reported date and death count. The visualization uses `d3.scaleSqrt` for radius mapping and processes data through custom React hooks for asynchronous loading of both map and migrant datasets.

SSuperShreejit
93% match
Loading thumbnail…

Missing & Death Migrate multi view

This visualization combines a world map with a time-series histogram to explore migrant deaths and disappearances. The map uses a D3 geoNaturalEarth1 projection with geoPath, rendering circles scaled by the square root of the total dead and missing per location, overlaid on graticule and land features from the world-atlas TopoJSON. Below, a React-based histogram bins the data by reported date using D3’s bin and timeMonths, summing casualties per month and displaying bars with hover tooltips. Data comes from a CSV of global migrant incidents.

AAmir
90% match
Loading thumbnail…

Missing Migrants Map + Histogram Combined

This visualization combines a world map with a time-series histogram to explore migrant deaths and disappearances. The map uses a natural Earth projection with proportional circles sized by the total dead and missing per location, while the histogram shows monthly totals over time. The code applies d3.geoPath for map rendering and d3.bin with time thresholds for histogram aggregation. React manages the component structure, with data loaded from a CSV of the Missing Migrants Project. SVG rendering renders both the map and the histogram, with a square root scale controlling circle radii.

BBen Brophy
90% match
Loading thumbnail…

Missing Migrant Part V [optimization]

This visualization combines a world map and a time-series histogram to explore mortality data from the Missing Migrant Project. The map uses a natural Earth projection with circles sized by the total dead and missing per location, while the histogram aggregates monthly totals. Users can brush the histogram to filter which incidents appear on the map. The React app uses d3.v5 for geo paths, scales, time binning, and brushing, rendering all graphics as SVG.

Aadewole-top
89% match
Loading thumbnail…

Migrants Multiple Views

This example combines a world map and a time-series histogram to visualize migrant deaths and missing persons. The map uses a natural Earth projection with graticules and country boundaries from TopoJSON, plotting circles scaled by `d3.scaleSqrt` to represent the total dead and missing per location. The histogram below aggregates the same data by month using `d3.histogram` and `d3.timeMonths`, with bar heights reflecting cumulative deaths. Both views are rendered as SVG within a React app, using `d3.csv` to load the Missing Migrants dataset and `topojson` for geographic features.

FFAN CHI YU(范紀予)
89% match
Loading thumbnail…

Map and Histogram

A map and histogram visualize the global distribution and monthly totals of migrant deaths and disappearances. The map uses a natural Earth projection with graticules and country borders, while scaled dark red circles represent the number of dead and missing at each location. The histogram below aggregates these incident counts by month. The visualization is built with React, D3 v5 (including `geoNaturalEarth1`, `geoPath`, `scaleSqrt`, `scaleTime`, and `bin`), and SVG rendering, pulling data from a CSV of missing migrants and world atlas TopoJSON.

Nnexus1058
89% match
Loading thumbnail…

React Histogram chart

This interactive histogram visualizes monthly migrant deaths and missing persons from a 2019 global dataset. Built with React and rendered as SVG, the chart uses D3’s `scaleTime`, `scaleLinear`, `bin`, and `timeMonths` APIs to bin reported dates into monthly intervals and sum the corresponding death counts. Each bar’s height and position derive from the linear y-scale and time x-scale, with tooltips revealing exact values and dates. Data is loaded via D3’s `csv` from a GitHub gist.

SSuperShreejit
89% match