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 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.

AI-generated description

A scatter plot of Data Canvas Sense Your City Dataset.

MIT Licensed

Similar vizzes

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

94% match

Loading thumbnail…

Fork of Working with Time

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.

Nnexus1058

94% match

Loading thumbnail…

Fork of Working with Time

This scatter plot displays the number of dead and missing migrants over time from the Data Canvas Sense Your City Dataset. The time axis is aggregated into monthly bins, with the total count per bin plotted. Built with React and D3 v5, it uses `d3.scaleTime` and `d3.scaleLinear` for axes, `d3.histogram` for binning, and `d3.extent` for domain calculation. SVG circles render the marks, with tooltips showing the month.

AAnkit-Ian-53787

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

93% match

Loading thumbnail…

Fork of Working with Time

This visualization is a bar chart that aggregates monthly totals of dead and missing migrants from the Data Canvas Sense Your City dataset, showing the sum of casualties over time. The x-axis uses a time scale with monthly bins, while the y-axis uses a linear scale for the count. Built with React and D3 v5, the code leverages `scaleTime`, `histogram` with `timeMonths` thresholds, and `sum` to bin and aggregate the data. SVG rectangles render the bars, with axes generated by custom `AxisBottom` and `AxisLeft` components.

Ssophievanderhorst

93% match

Loading thumbnail…

Fork of Working with Time

This visualization shows the monthly totals of dead and missing migrants from the Data Canvas Sense Your City dataset. It uses a bar chart rendered as SVG with React components, where each bar aggregates the sum of fatalities per month. The code uses D3 v5 APIs including `scaleTime`, `scaleLinear`, `bin`, `timeMonths`, and `sum` to bin the reported dates and compute monthly totals. Axes are drawn with custom React components, and the data is loaded asynchronously from a CSV file.

SSong Tao Chen

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

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

92% match