Significant Earthquake Database

100%

Significant Earthquake Database

✓ Published0🌍 Public

Last edited Oct 9, 2019

Created on Oct 3, 2019

This visualization plots significant earthquake events from NOAA’s Significant Earthquake Database as circles, with the x-axis showing the year and the y-axis showing magnitude. Circle color encodes earthquake duration in seconds, and hovering reveals the magnitude via tooltip. Using Vega-Lite API with d3.csv for data loading, the chart renders in SVG across the full viewport. The code configures axis styling and dark text through a custom Vega-Lite config object, with marks set to semi-transparent circles for overlapping event visibility.

AI-generated description

This data shows Significant Earthquake Database.</br> Each point represents an earthquake event.</br> The x-coordinate represents the different years, and the y-coordinate represents the earthquake magnitude. The color of circle indicates the duration of earthquake.

MIT Licensed

Similar vizzes

Loading thumbnail…

Worldwide Earthquake stats 2000-2015

This visualization displays earthquake statistics from 2000 to 2015, plotting the count of magnitude 8.0+ earthquakes per year as orange circles on an SVG canvas. The data is loaded from a CSV file and rendered using D3 v5’s `scaleLinear`, `axisBottom`, `axisLeft`, and `select` APIs, with gridlines generated via `tickSize`. Circle positions map year and earthquake count through the x and y scales, while axis labels and a title are added as SVG text elements.

Eedxiao97

81% match

Loading thumbnail…

Data Visualization

This visualization displays earthquake data from a CSV file, plotting year on the x-axis, magnitude on the y-axis, and encoding depth via circle radius. The SVG scatterplot uses d3.csv to load data, then d3.scaleLinear and d3.scaleSqrt for scales, with d3.axisBottom and d3.axisLeft generating the axes. Colored steelblue circles with 0.5 opacity clearly reveal distributions of earthquake events across the recorded timeframe.

HHassaan Gul

80% match

Loading thumbnail…

Vega-Lite API Template

This example visualizes earthquake data using a scatter plot, where the magnitude, depth, horizontal distance, year, and country of each earthquake are encoded through position, color, size, and tooltips. The visualization is built with the vega-lite-api library, which registers Vega and Vega-Lite to render an SVG output. Data is loaded asynchronously via d3.csv from a GitHub-hosted CSV file, and the chart is configured with custom axis and label styling for improved readability. The code also integrates vega-tooltip for interactive hover details.

VVarun Eranki

79% match

Loading thumbnail…

Significant Earthquake in World: 1970-2019

This interactive scatterplot visualizes significant earthquakes from 1970 to 2019, plotting attributes like magnitude, focal depth, and year on selectable X and Y axes via React dropdowns. Each point’s color indicates tsunami occurrence, with a color legend that fades non-hovered categories on mouseover. Built with React and D3 v5, the chart uses d3.scaleLinear, d3.scaleOrdinal, and SVG circles for marks, and includes axes rendered via custom React components. Data comes from the NOAA significant earthquake database, loaded as CSV through d3.csv.

Gguangxinhu

79% match

Loading thumbnail…

2019 Ridgecrest Earthquakes

This visualization plots over 1,500 earthquakes from the 2019 Ridgecrest sequence, showing magnitude on the x-axis versus depth on the y-axis. Each semitransparent black circle represents one quake, with tooltips revealing the exact date, magnitude, and depth. The code uses the vega-lite-api to construct the mark-circle encoding, with d3.csv for data loading. The dark-themed config customizes axis and label styling, while vega-tooltip provides interactive hover details.

CCurran Kelleher

78% match

Loading thumbnail…

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

78% match

Loading thumbnail…

2019 Ridgecrest Earthquakes

This visualization displays earthquakes from the July 2019 Ridgecrest sequence, filtering data to a specific time window and geographic region. Each circle represents an earthquake, with position encoding time and latitude, size encoding magnitude, and color encoding magnitude type. The code uses the vega-lite-api library to construct the specification, registers it with Vega-Lite and Vega, and loads filtered data via d3.csv. Data comes from a GitHub Gist, with RMS error, depth, and custom date parsing applied. Tooltips show date, magnitude, and depth values when hovering.

CCurran Kelleher

78% match

Loading thumbnail…

2019 Ridgecrest Earthquakes

This visualization shows earthquakes from the 2019 Ridgecrest sequence as a scatterplot of time against root-mean-square error, with circle size encoding magnitude and color encoding magnitude type. It filters the data to events with low RMS and a date before the main shock, then renders the marks using the vega-lite-api, which builds a specification executed by Vega-Lite and rendered as SVG via Vega. The code loads data with d3.csv, applies custom axis and label styling through a config object, and includes a tooltip for displaying date, RMS, and depth on hover.

CCurran Kelleher

77% match