Fork of Stylized Line React

100%

Fork of Stylized Line React

✓ Published0🌍 Public

Last edited Jan 13, 2023

Created on Jan 13, 2023

This visualization presents a time-series bar chart of reported migrant deaths and missing persons, aggregated into monthly bins from a CSV dataset. The chart displays the total count per month along a continuous time axis, with bars whose heights correspond to the summed values. The implementation uses React components, D3 v7 utilities such as `scaleTime`, `scaleLinear`, `histogram` for binning, and `timeMonths` for thresholds, rendering as SVG with custom axes and marks. The data is loaded via `d3.csv` from a remote gist, and styling uses the Poppins font.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter. css named colors

scatter plot test

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Migrant Deaths x2

This visualization displays monthly totals of dead and missing migrants over time using a bar chart. A time-series histogram is computed by binning reported dates into months using `d3.histogram` and `d3.timeMonths`, with the y-axis representing summed casualty counts. The chart is rendered as an SVG using React and D3 v7, with scales created via `d3.scaleTime` and `d3.scaleLinear`, and axes drawn by custom React components. Data is loaded asynchronously from a CSV using `d3.csv` and displayed without interaction.

JJohn Lewis

89% match

Loading thumbnail…

Fork of Missing Migrants Date Histogram

This visualization displays the monthly total of dead and missing migrants using a histogram built with React and D3 v5. The code uses `d3.bin` to group data by month via `timeMonths` thresholds and `d3.sum` to aggregate the "Total Dead and Missing" values for each bin. SVG rectangles render the bars with axes from `AxisBottom` and `AxisLeft`, while data comes from the Missing Migrants Dataset loaded through `csv`. Tooltips appear via SVG `<title>` elements, and the chart includes axis labels for time and casualty counts.

EEdgar Alves

87% match

Loading thumbnail…

Fork of Missing Migrants Date Histogram

This visualization shows monthly totals of dead and missing migrants from the Missing Migrants Dataset. It renders a bar chart as SVG, with time on the x-axis and cumulative deaths per month on the y-axis. Built with React and D3 v5, the code uses `d3.bin` with `timeMonths` thresholds to aggregate data, `d3.sum` to calculate monthly totals, and `scaleTime` and `scaleLinear` for axes. Hovering over a bar reveals its exact total via a native SVG `<title>` tooltip.

MMATTE-blz

87% match

Loading thumbnail…

Fork of Missing Migrants Scatter Plot

This visualization displays a bar chart of the Missing Migrants Dataset, showing the total number of dead and missing migrants per month over time. The code uses d3.csv for data loading, d3.scaleTime and d3.scaleLinear for axes, and d3.histogram with d3.timeMonths thresholds to bin events by month, summing the casualties. React components render SVG rect elements for each bar, with tooltips via the title element. The visualization is drawn with D3 v5 and React 16.9, using Poppins font styling.

Wweny1109

87% match

Loading thumbnail…

Fork of Fork of Missing Migrants Date Histogram

This visualization displays a date histogram of the total dead and missing migrants per month from the Missing Migrants Dataset. The chart uses React and D3 v5, employing `d3.bin` to group reported dates into monthly bins and `d3.sum` to aggregate the death tolls. SVG rectangles render the bars, with axes built from custom React components. The data is loaded asynchronously via `d3.csv` from a GitHub gist, and the y-axis shows total casualties while the x-axis spans time.

AAnkit-Ian-53787

87% match

Loading thumbnail…

Fork of Fork of Migrant Deaths x3

This histogram visualizes the monthly totals of dead and missing migrants from a subset of the Missing Migrants Global dataset. React renders the SVG, while D3 v7 handles data loading, time-based binning with `timeMonths`, and linear scaling. The chart uses two custom axis components and rectangular marks to display aggregated counts over time, with the y-axis formatted in compact notation.

JJohn Lewis

86% match

Loading thumbnail…

Fork of Missing Migrants Scatter Plot

This visualization shows monthly totals of dead and missing migrants from the Missing Migrants Dataset, displayed as a bar chart over time. The dataset is loaded via `d3.csv` and processed with `d3.bin` and `d3.timeMonths` to aggregate individual events. React components render SVG axes and marks, with scales created via `d3.scaleTime` and `d3.scaleLinear`. A tooltip using SVG `<title>` elements reveals exact values on hover.

Uuplusv

86% match

Loading thumbnail…

Fork of Fork of Missing Migrants Date Histogram

This visualization displays a date histogram of the total dead and missing migrants per month, sourced from the Missing Migrants Dataset. It uses d3.bin with timeMonths thresholds to group the data, d3.sum to aggregate monthly totals, and scales with d3.scaleTime and d3.scaleLinear. The React components render SVG axes and rectangular marks, with a tooltip showing the count on hover. Styling uses the Poppins font with teal bars and gray gridlines.

PPavan Nimmagadda

86% match