Log Scale, Missing Migrants Scatter Plot (codeAlong)

100%

Log Scale, Missing Migrants Scatter Plot (codeAlong)

✓ Published0🌍 Public

Last edited Jun 16, 2021

Created on Jun 16, 2021

Forked from Missing Migrants Scatter Plot

This scatter plot visualizes the Missing Migrants Dataset, with each circle representing a single migration event plotted by reported date on the x-axis and total dead or missing on the y-axis. The y-axis uses a logarithmic scale (d3.scaleLog) to accommodate the wide range of reported casualties, while the x-axis uses a time scale with formatted tick labels. Built with React and D3 v5, the visualization renders as an SVG using custom axis components and a Marks component that maps data points to circles with tooltips. The data is loaded asynchronously from a CSV file via d3.csv and parsed for numeric and date values.

AI-generated description

A scatter plot of the Missing Migrants Dataset.

Each point in the plot represents a single event.

MIT Licensed

Similar vizzes

Loading thumbnail…

Missing Migrants Scatter Plot Log Scale

This scatter plot visualizes the Missing Migrants dataset, with each point representing a single migration event. The x-axis encodes the reported date using a time scale, while the y-axis uses a logarithmic scale to show the total number of dead and missing individuals. The visualization is built with React and D3 v5, using `scaleTime`, `scaleLog`, and `extent` to compute scales, and custom SVG components for axes and marks. Data is loaded asynchronously via `d3.csv` from a GitHub gist, with each point rendered as a circle containing a tooltip.

CChris Briggs

93% match

Loading thumbnail…

Missing Migrants Scatter Plot Log Scale

A scatter plot displays the Missing Migrants Dataset, with each point representing an event and positioned by reported date on the time-based x-axis and the total dead and missing on a log-scale y-axis. Built with React and D3 v5, the visualization uses `scaleTime` and `scaleLog` to map data to SVG coordinates, while custom `AxisBottom` and `AxisLeft` components render ticks. Circles are drawn via the `Marks` component with tooltips showing the date. Data loads asynchronously via `d3.csv`, and the chart includes rotated axis labels.

TTatyana Milanova

93% match

Loading thumbnail…

Missing Migrants Scatter Plot Log Scale

This scatter plot visualizes the Missing Migrants Dataset, with each circle representing a single event. The x-axis shows reported dates over time, while the y-axis displays the total dead and missing using a log scale to accommodate the wide range of values. Built with React and D3 v5, the visualization uses `scaleTime` and `scaleLog` for axes, alongside custom `AxisBottom`, `AxisLeft`, and `Marks` components. The code leverages D3's `csv` loader to fetch data and renders interactive tooltips via the SVG `title` element.

RRMartins11

93% match

Loading thumbnail…

Log scale Missing Migrants Scatter Plot

This scatter plot visualizes missing migrant incidents over time, with each point representing a single event and the y-axis using a log scale to display the "Total Dead and Missing" count. Built with React and D3 v5, the visualization renders as an SVG, using `scaleTime` for the x-axis, `scaleLog` for the y-axis, and custom `AxisBottom`, `AxisLeft`, and `Marks` components to draw tick marks and circles. Data comes from the Missing Migrants Dataset, loaded via D3’s `csv` function, with tooltips showing the reported date on hover.

SShuyu Zheng

93% match

Loading thumbnail…

Missing Migrants Scatter Plot Log Scale

This scatter plot visualizes the Missing Migrants dataset, showing each reported incident as a circle positioned by date on the x-axis and the total dead and missing on a logarithmic y-axis. The visualization uses a log scale to accommodate the wide range of casualty counts, with hover tooltips revealing exact dates. Built with React and d3.v5, the code employs `scaleLog` for the y-axis, `scaleTime` for the x-axis, and SVG rendering for the marks and axes, with data loaded from a CSV using `csv()`.

Aazharahmad0

93% match

Loading thumbnail…

Missing Migrants Scatter Plot Log Scale

This scatter plot visualizes the Missing Migrants Dataset, with each point representing a single migration event. The x-axis encodes reported dates using a time scale, while the y-axis uses a logarithmic scale to display the total number of dead and missing, compressing large values for clarity. Built with React and rendered as SVG, the visualization uses d3.scaleLog, d3.scaleTime, and d3.csv for data loading. Axis components are custom React functions that generate tick marks and labels, with tooltips on each circle showing the exact date.

Jj-PGi

93% match

Loading thumbnail…

Missing Migrants Scatter Plot Log Scale

This scatter plot displays events from the Missing Migrants Dataset, plotting reported dates against the total number of dead and missing per incident. The visualization uses a logarithmic y-scale to accommodate the wide range of casualty counts, with each circle representing a single event. Built with React and D3 v5, the code employs `scaleTime` and `scaleLog` for axes, renders marks as SVG circles, and provides tooltips via `d3.csv` data loading.

Ccshm407

93% match

Loading thumbnail…

Missing Migrants Scatter Plot Log Scale

This scatter plot visualizes the Missing Migrants Dataset, with each point representing a single migration event. The x-axis shows the reported date using a time scale, while the y-axis uses a logarithmic scale to display the total dead and missing count, ranging from 1 to the maximum value. The visualization is built with React and D3 v5, using SVG rendering. The code defines custom axis components (AxisBottom and AxisLeft) and a Marks component that renders circles with tooltips showing the exact date. The data is loaded from a CSV file using D3's csv parser.

Wwindwaver

93% match