D3 Scatter Plot With Brush - Earthquakes

D3 Scatter Plot - Earthquakes

A scatter plot displays earthquake magnitude (Richter scale) on the y-axis against time (years 1900–1999) on the x-axis, with each circle's radius encoding the number of deaths. The plot uses D3 v6 with SVG rendering, employing `scaleLinear` for axes and circle size, `extent` for domain calculation, and `axisLeft`/`axisBottom` for tick marks. Data comes from a CSV file loaded via `d3.csv`, and circles are drawn with semi-transparent opacity to show overlapping points across the timeline.

91% match

D3 Line Chart With Brush - Earthquakes

A D3 line chart visualizes global total earthquake deaths per year from 1900 to 1999, using data from a CSV of earthquake records. Circles mark individual yearly totals, connected by a steelblue line. An interactive brush (d3.brushX) allows selection along the x-axis; selected circles turn red, and double-clicking either clears the selection or selects all data if none exists. The chart uses d3.scaleLinear for both axes, d3.axisLeft, d3.axisBottom, and d3.rollup to aggregate deaths by year, rendered as SVG elements.

89% match

Interactive Visualization (Brush) - Earthquake Data

This interactive visualization presents earthquake data from the 19th century through three coordinated views: a bar plot of deaths by region, a world map with circles sized by Richter magnitude, and a scatter plot correlating year, magnitude, and deaths. A brush interaction on the scatter plot filters the year range across all views. The map uses d3.geoMercator projection with d3.geoPath to render country boundaries from a GeoJSON source, includes a magnitude legend, and displays country names via tooltips on mouseover. The charts are built with D3 v7 APIs including scaleBand, scaleLinear, and the join operator.

86% match

Fork of Interactive Visualization (Brush) - Earthquake Data

This interactive visualization explores earthquake data from the 19th century through three coordinated views: a bar plot of total deaths by region, a world map with circles sized by Richter magnitude, and a scatter plot relating year, magnitude, and death toll. A brush on the scatter plot filters data across all views, while tooltips display country names on the map alongside a legend for magnitude. The code uses D3 v7 APIs including d3.csv, d3.scaleBand, d3.scaleLinear, d3.geoMercator, d3.geoPath, and d3.brushX to render SVG with animations, sourcing data from a GitHub gist.

AAnthony Zornig

83% match

Interactive Visualization (Brush) - Earthquake Data

This interactive dashboard visualizes earthquake data with three synchronized views: a bar plot of regional death tolls, a world map showing earthquake locations with circle radii scaled by Richter magnitude, and a line chart depicting global deaths by year. The code uses d3.geoPath with a Mercator projection to render the map, while d3.brush enables year selection that updates all views. Hovering over map regions triggers tooltips via mouseover events, and a legend explains the Richter scale. Data is loaded via d3.csv from an external gist URL, with d3.scaleLinear and d3.scaleBand managing the axes.

earthquake

This scatter plot visualizes earthquake frequency by year, with each orange circle representing a data point and the y-axis labeled "nums_of_earthquake." The visualization uses d3.csv to load data from a remote earthquakes dataset, d3.scaleLinear for both axes, and d3.axisBottom and d3.axisLeft to render tick marks and gridlines. The SVG chart is generated with d3.v5, applying margin-based layouts, axis labels, and a title, while styling circles and text through external CSS.

Eedxiao97

Fork of Interactive Visualization (Brush) - Earthquake Data

This visualization presents earthquake data through three linked views: a bar plot of regional death tolls, a world map plotting earthquake locations with circle size encoding Richter magnitude, and a scatter plot relating year, magnitude, and deaths. A brush selection on the scatter plot filters the other views, while map tooltips display location names and a legend explains magnitude scaling. The code uses d3.v7 with `d3.geoMercator` projection, `d3.geoPath` for map rendering, and `d3.scaleBand`/`d3.scaleLinear` for chart axes. Data comes from a GitHub-hosted world GeoJSON and earthquake CSV.

AAbhishek Singh

Fork of Interactive Visualization (Brush) - Earthquake Data

This visualization of earthquake data combines a bar plot, world map, and scatter plot to explore regional deaths, epicenter locations with Richter magnitudes, and the relationship between year, magnitude, and casualties. Users can brush on the scatter plot to filter the other views by year. The map uses d3.geoMercator with d3.geoPath to render world geography, while tooltips display country names on hover. All charts are built with d3.v7, rendering as SVG with animation, and the data is loaded from an external CSV source.

Sspace-captain96