Skip to main content
100%

Icelandic earthquakes (D3)

✓ Published0🌍 Public
ZZJONSSON
Last edited Oct 11, 2011
Created on Oct 11, 2011

An animated map visualizes earthquakes in Iceland over time, plotting each event as a colored circle whose size reflects magnitude and color indicates depth. The map is rendered using D3.js with a slippy map background, while a date slider, play button, and speed, size, and fade controls let users scrub through the timeline. The data comes from a CSV file containing latitude, longitude, depth, and magnitude; interactions are powered by jQuery UI sliders and custom SVG pan/zoom utilities.

AI-generated description

Similar vizzes

Loading thumbnail…

Gist 72be73d247fa60de43935bf3dae309e5

This example visualizes earthquake activity near Grindavík, Iceland, using a 3D terrain map. It displays earthquake epicenters as colored markers, with color and size representing magnitude and depth, plotted over a textured landscape. The visualization uses Three.js for 3D rendering and D3.js for data loading and spatial projection, with `d3.geoPath` to generate the terrain geometry. Earthquake data is sourced from a CSV file containing date, time, latitude, longitude, depth, and magnitude.

TThomasG77
78% match
Loading thumbnail…

Earthquake Map

This map visualizes global earthquakes using D3.js, plotting each event as a colored circle on a dark equirectangular projection. Circle size and color encode earthquake magnitude, with the data sourced from a CSV file of USGS earthquake records. The map employs an SVG rendering and includes a polar fisheye distortion effect, initially centered on Japan, that magnifies the map around the cursor's position. The fisheye implementation uses D3’s projection and custom fisheye.js, with event handling throttled for performance.

PPhilippe Rivière
76% match
Loading thumbnail…

Ver3 Earthquakes (past 30 days)

This visualization displays global earthquake activity from the past 30 days on an interactive world map. Circles are positioned using a D3 geoEquirectangular projection, with circle size encoding earthquake magnitude. Color encodes depth, with red for shallow (<70km), green for intermediate (70-300km), and blue for deep (≥300km) earthquakes. The map also shows country boundaries, graticules, and tectonic plate boundaries. Users can click any earthquake circle to open its USGS details page in a new tab, or pan and zoom using the d3.zoom() interaction. Additional brush-based zooming is implemented to allow for more intuitive exploration of the data.

Llingjizhu@gmail.com
75% match
Loading thumbnail…

draft earthquake data

This visualization uses earthquake data from a USGS dataset to map seismic events by location and magnitude on a world map. Each earthquake is represented as a circle, with its size scaled by magnitude and its position determined by latitude/longitude coordinates. The depth of the quakes is encoded through color, creating a gradient from shallow to deep events. The map is rendered with SVG paths for continents, and a custom tooltip provides details on click or hover. Circles are drawn with D3's data-join and scaled using a linear magnitude scale, while the map projection and graticule are set up with D3's geo utilities. The visualization highlights the global distribution and intensity of recent seismic activity, with Nepal, Japan, and the South Pacific clearly standing out.

BBenHeubl
74% match
Loading thumbnail…

Earthquake Map

This map visualizes global earthquake activity over a two-week period in September 2015. Each circle marks an earthquake, sized by magnitude and colored by depth, with larger and darker circles indicating stronger, shallower events. The visualization uses the D3.js library to project earthquake epicenters onto a world map, with a legend clarifying the depth-color mapping and magnitude scaling. The map is rendered with SVG, with circles positioned by latitude and longitude coordinates from the dataset. The included data shows a cluster of significant seismic activity off the coast of Chile, as well as events across the Pacific Ring of Fire. The visualization effectively communicates the global distribution of earthquakes and relative intensities through its circle sizing and color scheme.

PPhilippe Rivière
74% match
Loading thumbnail…

EarthQuakes Bubblegraph

This visualization displays recent significant earthquakes as a bubble graph, plotting each seismic event as a circle positioned by its magnitude. The interactive map, rendered as an SVG canvas, uses mouseover events to highlight individual quakes and display their location and magnitude in a text element. Built with React and D3.v5, the code fetches live data from the USGS Earthquake API, styling each bubble with radius scaled to magnitude and colored by alert level, set against a stylized blue background.

SSreenivasulu
73% match
Loading thumbnail…

Gist c91b7cdf3a65a705ef48

This example visualizes earthquake activity using a force-directed particle layout. Each circle is an earthquake, positioned by its longitude and latitude and scaled by magnitude; the particles are animated with a gentle jitter to reveal clustered events. The visualization is rendered with D3 v3 using SVG, mapping the `data.csv` fields—such as depth, magnitude, and location—to visual variables. A shared timeline and smooth transitions help the user explore the relationship between location, time, and earthquake strength across the dataset.

BBenHeubl
72% match
Loading thumbnail…

New Zealand Earthquakes

This interactive scatterplot visualizes the pattern of earthquakes in New Zealand from July 2010 to August 2012, plotting each event by its week and time of day, with point size reflecting magnitude. The visualization uses D3.js version 3.5.17 to render SVG circles with tooltips, axes, and grid lines. Data is loaded from a CSV file containing dates, times, and magnitudes, and the code employs `d3.time.format` for parsing and formatting temporal values, alongside `d3.svg.axis` for the coordinate scales.

Dd3noob
72% match