Test for React

100%

Test for React

✓ Published0🌍 Public

Last edited Feb 17, 2020

Created on Feb 17, 2020

This visualization combines a world map with a temporal histogram to show migration-related fatalities. The map uses D3 geoNaturalEarth1 projection with geoPath to render landmasses and graticules, while scaled circles represent total dead and missing per location. The histogram bins reported dates into monthly intervals using d3.histogram, with a brushX selection filtering the map’s displayed data. React manages state and component rendering, fetching CSV data and TopoJSON world atlas via custom hooks.

AI-generated description

Just gonna mess with this one

MIT Licensed

Similar vizzes

Loading thumbnail…

React world map + migrant death/missing points + histogram

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.

SSuperShreejit

89% match

Loading thumbnail…

React Performance Optimization

This interactive visualization combines a world map and a time-series histogram to explore migration incidents. The map displays circles sized by the total number of dead and missing migrants, while the histogram shows monthly totals, with a brush tool to filter the map’s data by date range. Built with React and D3 v5, it uses `geoNaturalEarth1` and `geoPath` for the map, `scaleTime` and `histogram` for binning, and `brushX` for interaction, with `useMemo` caching to optimize rendering.

NNikhil Reddy Manda

86% match

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

86% match

Loading thumbnail…

test

An interactive visualization combines a bubble map with a date histogram to explore global migrant deaths. The map uses a natural Earth projection for country boundaries and graticules, with circle radii scaled to the square root of the death count. The histogram bins reported deaths by month, and a brush filter on the histogram updates the map’s displayed data, revealing temporal patterns. Data comes from the Missing Migrants Project CSV, while country shapes are derived from the world-atlas TopoJSON. The implementation leverages D3 v5 for projections, scaling, and brushing, all within a React component rendering SVG.

AAmir

85% match

Loading thumbnail…

multiple views of map + chart D3/react

This visualization combines a natural Earth projection world map with a time-series bar chart to display global migrant fatalities. The map uses d3.geoNaturalEarth1, d3.geoPath, and d3.geoGraticule to render country boundaries and graticules, with circle sizes scaled by d3.scaleSqrt based on reported deaths. The histogram below aggregates monthly death totals using d3.bin and d3.timeMonths, drawing both bars and a smooth curve via d3.curveNatural. React manages the component structure, while data comes from a CSV of missing migrant incidents and TopoJSON world atlas boundaries.

MMohammed Banani | MbDev

85% match

Loading thumbnail…

React Performance Optimization - Episode 45

This interactive visualization combines a world bubble map and a time-series histogram to explore global migrant deaths in 2019. Users brush over the histogram to filter the map, which plots circles sized by the number of dead and missing at each location. The code uses React with `useMemo` for performance, D3 v5 utilities like `geoNaturalEarth1`, `geoPath`, `geoGraticule`, and `scaleSqrt`, and renders via SVG. Data comes from the Missing Migrants Project and world boundaries from World Atlas TopoJSON.

Rroc286

84% 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

84% match

Loading thumbnail…

A D3 map

This visualization combines a D3 natural Earth projection map with a time-series histogram. The map displays circles sized by migrant death tolls using `geoNaturalEarth1` and `geoPath`, while the histogram bins reported dates into monthly intervals using `d3.histogram` and `scaleTime`. The React app loads country boundaries from World Atlas TopoJSON and migrant data from a CSV, rendering all elements as SVG.

Mmaavwin6

84% match