Fork of Working with Time

100%

Fork of Working with Time

✓ Published0🌍 Public

Last edited Apr 17, 2021

Created on Apr 17, 2021

This visualization plots reported migrant deaths and disappearances over time, with each circle representing an incident and its vertical position encoding the number of dead or missing. The scatterplot is built with React components rendering SVG, while D3 utilities handle data loading via `d3.csv`, scales via `scaleTime` and `scaleLinear`, and axis tick generation. Data comes from a Missing Migrants Project CSV file, with tooltips showing formatted dates.

AI-generated description

A program that loads in some data about CSS named colors using D3 utilities, and uses React to render the data as a radial burst!

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Working with Time

This visualization shows the total number of dead and missing migrants over time, plotted as a scatter plot. Each circle represents a date with its corresponding casualty count, with tooltips displaying the exact date on hover. The chart uses React components to render SVG elements, with D3 scales (scaleTime and scaleLinear) handling the axes and data mapping. The data comes from the Data Canvas Sense Your City Dataset, loaded via D3’s csv function, and the visualization includes styled tick marks and axis labels for clarity.

Nnexus1058

94% match

Loading thumbnail…

Fork of Working with Time

This example visualizes the number of total dead and missing migrants over time, with each circle representing a reported incident plotted along a time-based x-axis and a linear y-axis. Built with React and D3 v5, it uses `scaleTime`, `scaleLinear`, and `extent` to map the data, while custom React components render the axes and SVG circles. The dataset is loaded asynchronously via `d3.csv` from a GitHub gist, and includes native SVG tooltips using the `<title>` element.

Mmikekslv

93% match

Loading thumbnail…

Fork of Working with Time

This visualization displays the total number of dead and missing migrants over time, binned by month to reveal temporal trends. The React-based code uses d3.csv to load the Data Canvas Sense Your City dataset, then applies d3.scaleTime, d3.scaleLinear, and d3.bin with d3.timeMonths thresholds to aggregate and render the histogram. Custom SVG axes are drawn with d3.ticks and timeFormat labels, while a native SVG `<title>` element provides hover tooltips. The interactive chart appears static but relies on React’s useEffect hook for asynchronous data loading and conditional rendering.

Qqtrfx

91% match

Loading thumbnail…

Fork of Missing Migrants Scatter Plot

This fork of the Missing Migrants scatter plot visualizes individual migration-related events over time, mapping reported dates on the x-axis against total dead and missing counts on the y-axis. Built with React and rendered as SVG using d3.scaleTime and d3.scaleLinear, it loads data via d3.csv from a subset of the Missing Migrants Dataset. Each circle represents an event, with basic tooltips provided through SVG title elements and custom axis components generating ticks and labels.

RRupendra Pamisetty

90% match

Loading thumbnail…

Fork of Fork of Working with Time

This histogram visualizes the total number of dead and missing migrants over time, with monthly bins along the x-axis and aggregated death counts on the y-axis. It uses d3.csv to load the Missing Migrants dataset, d3.bin with timeMonths thresholds to group reported dates, and d3.scaleTime and d3.scaleLinear to map the data. React components render the SVG axes and rectangular marks, with CSS styling for ticks and bars.

Mmikekslv

90% match

Loading thumbnail…

Fork of Missing Migrants Scatter Plot Log Scale

This fork of the Missing Migrants scatter plot visualizes individual migration-related death events over time. Each circle represents one event, with the reported date on the x-axis and the total dead and missing on a log-scaled y-axis. Built with React and D3 v5, it uses `scaleTime` and `scaleLog` for axes and renders SVG circles. The code loads data via `csv` from a GitHub gist, with axes constructed from reusable components and tooltips provided by SVG `<title>` elements.

Bbillmccabeusa@hotmail.com

89% match

Loading thumbnail…

Fork of Working with Time

This visualization aggregates monthly counts of dead and missing migrants from a Data Canvas Sense Your City Dataset, displaying the data as a histogram with time on the x-axis and total fatalities on the y-axis. Using React and d3.v5, it employs `d3.scaleTime`, `d3.bin`, and `d3.timeMonths` to bin events by month, while `d3.max` and `d3.extent` set scale domains. SVG rectangles render the bars, with axes generated by custom React components and tooltips via SVG `<title>` elements.

BBrian Philip

89% match

Loading thumbnail…

Fork of Working with Time

This visualization shows the total number of dead and missing migrants over time, using a bar chart where each bar aggregates the data by month. The chart displays the counts on the y-axis and dates on the x-axis, with a tooltip revealing the exact value for each bar. The code builds the visualization using React, the d3.scaleTime and d3.scaleLinear functions for axes, and the d3.histogram `bin` function to group data by months. The data is loaded from a CSV file of the Data Canvas Sense Your City dataset.

AAmnaRizvi-S

89% match