California Earthquakes

100%

California Earthquakes

✓ Published0🌍 Public

Last edited May 21, 2017

Created on May 18, 2017

This visualization maps California earthquakes from the USGS live GeoJSON feed onto a state map. Red dots mark earthquake epicenters, sized by magnitude, with hover interactions showing details in a corner panel. The map uses a conic conformal projection for California state plane coordinates, rendered with D3 v4 and default SVG paths via the `d3.geoPath` API. County and state boundaries come from a TopoJSON source, processed using the TopoJSON client library, while the earthquake layer is drawn after the map is projected.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

NY Counties

This example visualizes earthquake epicenters overlaid on California county boundaries. Red points mark quake locations; a tooltip shows each event's magnitude and place name, while a yellow highlight appears on hover. The visualization uses a conic conformal projection and plots California counties from a TopoJSON file, with earthquake data pulled from the USGS GeoJSON feed. The code employs d3.geoPath for map rendering, d3.json for loading both datasets, and mouseover/mouseout events for interactivity.

MMTClass

86% match

Loading thumbnail…

California Counties

This example visualizes California counties with a map rendered using SVG and the D3.js v4 library. It loads county boundaries from a TopoJSON file and an earthquake feed from USGS, though only the county boundaries are drawn. The map uses a conic conformal projection via `d3.geoConicConformal` and `d3.geoPath`, with the projection fit to the state’s extent. Hovering over a county highlights it in crimson and displays its name and population in an overlay, using a mouseover event and the `d3.format` API.

MMTClass

84% match

Loading thumbnail…

LA quakes

A world map of Los Angeles and its surroundings displays earthquake epicenters as crimson paths, with the view centered on coordinates -117, 34 and zoomable via d3.zoom. The d3-tile library loads OpenStreetMap vector tiles from Mapzen, rendering roads and rails as SVG paths styled by property kind. Earthquake data comes from the USGS GeoJSON feed, plotted using d3.geoPath with a d3.geoMercator projection, and their positions update dynamically on zoom transforms.

MMTClass

80% match

Loading thumbnail…

Class 5

This visualization displays earthquake locations across the United States from the USGS live feed, with each quake colored by magnitude using a d3.scaleOrdinal color scale. State boundaries render as gray paths via TopoJSON and d3.geoPath with an AlbersUSA projection. A legend with circles shows magnitude ranges and counts, while hovering reveals coordinates through d3.mouse and projection.invert. The map filters quakes to viewport-visible coordinates and removes legend entries exceeding the largest observed magnitude.

MMTClass

79% match

Loading thumbnail…

Earthquake Map

This map shows earthquake locations across the United States, with each quake colored by magnitude range from green (0-1.0) to red (3.0-4.0). The visualization uses d3.geoPath and d3.geoAlbersUsa to project USGS earthquake feed data onto state boundaries from a TopoJSON file, with d3.legendColor providing the magnitude legend. Separate SVG layers render quakes for each magnitude bin, and text annotations display counts per category.

AAnaMal08

79% match

Loading thumbnail…

LA quakes

The map displays earthquakes around Los Angeles as crimson paths, projected using the Mercator projection, over a zoomable, tile-based street map. It relies on `d3.geoMercator`, `d3.geoPath`, and `d3.tile` to render vector tiles from OpenStreetMap, while quake data is fetched from the USGS GeoJSON feed. Zooming updates the projection and repositions earthquake paths accordingly.

MMTClass

79% match

Loading thumbnail…

class 4 - states

This D3 visualization displays a map of US states generated from a GeoJSON TopoJSON source, overlaid with earthquake locations from the USGS all-week feed. It shows the geographic distribution of recent seismic activity across the country, with each quake rendered as a crimson point. The map uses the `d3.geoAlbersUsa` projection and `d3.geoPath` for both state boundaries and earthquake points. As the mouse moves, the page displays the cursor’s geographic coordinates, computed via `projection.invert` and formatted with `d3.format`.

MMTClass

78% match

Loading thumbnail…

Class 5

This visualization displays earthquakes from the past week across a map of the United States, with points colored by magnitude and a legend showing the number of quakes in each magnitude range. It uses d3.geoPath with a d3.geoAlbersUsa projection to render TopoJSON state boundaries, while earthquake data arrives as GeoJSON from the USGS feed. The map includes a draggable orange circle, and mouse movement updates a readout of geographic coordinates using the inverse projection.

MMTClass

78% match