Natural Disasters

Natural disaster death over years

A scatter plot visualizes deaths from natural disasters—including drought, earthquake, epidemic, and extreme temperature—from 1900 to 2017, using data loaded from a CSV file. Each circle represents a disaster event, with its position mapped by year and death toll, while color encodes the disaster type. The visualization uses D3 v5 with SVG rendering, employing `scaleTime` and `scaleLinear` for axes, `scaleOrdinal` for color categories, and interactive legends that filter events by type. Hover interactions highlight individual events, and axis labels clarify the time and mortality scales.

69% match

Cyber Attacks

This example displays the first record from a CSV dataset of cyber security attacks as a raw JSON object in a preformatted text block. It loads the data with a JSON import, parses the CSV, converts the `Packet Length` and `Anomaly Scores` fields to numbers, and then renders the parsed object’s fields. The visualization relies on the native Web Platform APIs for parsing and DOM manipulation, without external charting libraries. The source data is Inscribo's Cyber Security Attacks dataset on Kaggle.

Ccoreyfnolan@gmail.com

67% match

World Population

This example displays the first row of a world population dataset as a formatted JSON object in monospace text. It uses population statistics from the Socioeconomic Data and Applications Center, covering decades from 1970 through 2022 alongside geographic attributes like continent, area, and density. The code loads the CSV data through an import statement, converts all numeric fields to JavaScript numbers, and renders the output using a template literal with a preformatted text element. The visualization presents raw data without additional charting libraries, focusing on exposing the dataset structure for inspection.

Ccoreyfnolan@gmail.com

Natural disaster death over years

A scatter plot shows global deaths from natural disasters such as drought, earthquake, and epidemic by year, with each circle colored by disaster type. Users click a legend to filter and highlight categories. The visualization uses d3.csv to load data, scaleLinear for axes, axisLeft and axisBottom for ticks, and scaleOrdinal with schemeCategory10 for colors. It renders SVG circles with tooltips on mouseover and mouseout, based on data from Our World in Data.

Natural disaster death over years

This scatter plot visualizes deaths from natural disasters, organized by disaster type and year, allowing users to explore trends and identify significant events. The visualization uses D3 v5 to render an interactive SVG chart with a color-coded legend; clicking a legend entry filters the plotted circles by that disaster type. The data is loaded via CSV and scales use d3.scaleTime and d3.scaleLinear, with axes generated by d3.axisBottom and d3.axisLeft.

Natural disaster death over years

This scatter plot shows deaths from natural disasters from 1900 to 2017, with each point representing a disaster type (drought, earthquake, epidemic, or extreme temperature) and its year. The y-axis displays total deaths on a linear scale, while the x-axis shows time. A color legend allows filtering by disaster type, dimming unselected categories. Built with D3 v5, it uses `scaleTime`, `scaleLinear`, `scaleOrdinal`, and SVG rendering. Data comes from a CSV file with entity, year, and death counts.

Natural disaster death over years

A scatter plot displays deaths from natural disasters per year, colored by disaster type such as drought, earthquake, and epidemic, with a legend for filtering. The visualization uses D3 v5 to render SVG circles, scales, and axes, and includes animated tooltips on hover. Data comes from Our World in Data, with interactions implemented via D3’s `scaleOrdinal`, `axisBottom`, `axisLeft`, and event handlers for mouseover and click filtering.

Natural disaster death over years

This animated scatter plot displays deaths from natural disasters over time, with each circle representing a recorded event colored by disaster type (drought, earthquake, epidemic, or extreme temperature). The visualization uses D3.js v5 with SVG rendering, and users can click legend items to highlight specific categories while dimming others. The chart includes axis labels, a title, and a hover tooltip showing event details. Data comes from Our World in Data, and the code uses d3.scaleLinear, d3.scaleOrdinal, d3.axisBottom, d3.axisLeft, and event handlers for interactivity.