Class 6-MT

100%

✓ Published0🌍 Public

Last edited Mar 15, 2017

Created on Mar 13, 2017

This example plots earthquake magnitude against time over the past week, combining a red line through the data points with a blue scatterplot of individual events. The visualization uses D3 v4's `d3.csv` to load data from the USGS earthquake feed, `d3.scaleTime` and `d3.scaleLinear` for axes, and `d3.line` for the trend line. Circle elements mark each quake’s magnitude, with gridlines added via custom axis functions, all rendered as SVG.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

Class 6 ScatterPlot

This visualization plots earthquake magnitudes against time over a week, using a scatterplot with circles positioned by time on the x-axis and magnitude on the y-axis. The code overlays a line path connecting the data points via d3.line, though the primary focus is the scatter of events. It loads live data from the USGS earthquake feed as CSV, parses timestamps with d3.utcParse, and applies d3.scaleTime and d3.scaleLinear for axes. The SVG is rendered with D3 v4, and hovering over a dot turns it red. The visualization also attempts to add a legend, but the referenced color scale is undefined, so no legend appears.

MMTClass

91% 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

81% match

Loading thumbnail…

Class 5

This visualization shows earthquake locations and magnitudes across the United States over the past week, using a color scale to group magnitudes into ordinal bins. A legend on the right lists magnitude ranges with counts of quakes per bin, and mousing over the map displays geographic coordinates. The code uses d3.geoAlbersUsa and d3.geoPath for the map projection, loads state boundaries from TopoJSON and earthquake data from USGS GeoJSON, and employs d3.scaleOrdinal with d3.schemeCategory10 for magnitude-dependent fill colors.

MMTClass

80% match

Loading thumbnail…

Class 5

A United States map rendered as gray SVG paths displays earthquakes from the last week, sized and colored by magnitude on a categorical scale. Each quake is drawn as a crimson path using `d3.geoPath` with a `d3.geoAlbersUsa` projection, while a legend counts quakes per magnitude bin. The map fills the viewport, and moving the mouse updates a coordinate readout via `projection.invert` and `d3.mouse`. Data comes from USGS GeoJSON and state boundaries from TopoJSON.

MMTClass

79% match

Loading thumbnail…

in class scatterplot March 16 long/mag

This scatterplot maps earthquake longitude against magnitude, with each circle representing a single seismic event from the USGS GeoJSON feed. The chart clearly shows the distribution of earthquake strengths across global longitudes, using a linear scale for both axes. Built with D3 v3, the visualization employs `d3.scale.linear` for coordinates, `d3.svg.axis` for tick marks, and `d3.scale.category10` to color the dots. The SVG rendering includes axis labels, and a legend is attempted, though the color domain contains no actual categories.

MMTClass

79% match

Loading thumbnail…

Class 5

This map of the United States displays earthquake locations from the USGS live feed for the past week, with each quake represented as a circle colored by magnitude using a D3 ordinal color scale. The visualization uses `d3.geoAlbersUsa` for the map projection, `d3.geoPath` to render state boundaries, and `topojson.v2` for GeoJSON conversion. A legend at the right shows magnitude ranges with quake counts, while mouseover coordinates are displayed via a D3 text element.

MMTClass

78% match

Loading thumbnail…

class 4 - states

This visualization displays earthquakes recorded in the United States over the past week, color-coded by magnitude on a dark basemap of state boundaries. It uses D3.js v4 with the `d3.geoAlbersUsa` projection and `d3.geoPath` to render both the TopoJSON state outlines and GeoJSON earthquake points from the USGS real-time feed. The points are filtered into four magnitude bins and drawn with distinct colors, while a legend built with d3-legend explains the scale.

MMTClass

78% 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

78% match