Skip to main content
SimilarExport ZIP
100%

Class 6 ScatterPlot

✓ Published0🌍 Public
MMTClass
Last edited Mar 12, 2017
Created on Mar 12, 2017

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.

AI-generated description

Built with blockbuilder.org

mit Licensed

Similar vizzes

Loading thumbnail…

Class 6-MT

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.

MMTClass
91% 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
82% match
Loading thumbnail…

homework 6

This scatterplot compares earthquake magnitude and timing worldwide over one week, with California earthquakes highlighted in red against green global data. It displays counts for both groups and notes that 53% of all earthquakes occurred in California. The code loads CSV data from the USGS earthquake feed, parses timestamps with `d3.utcParse`, filters California points using bounding-box coordinates, and renders circles with `d3.selectAll("dot").enter().append("circle")` on an SVG canvas. Axes are generated using `d3.axisBottom` and `d3.axisLeft`.

AAnaMal08
81% match
Loading thumbnail…

Scatter Plot Mag Depth

This interactive scatter plot displays earthquake magnitude against depth using live USGS GeoJSON data for all earthquakes from the past day. Each circle represents a quake, positioned by its depth on the x-axis and magnitude on the y-axis, with hover tooltips revealing the exact values. Built with D3 v4, it uses `d3.json` for data loading, `d3.scaleLinear` for axis ranges, and SVG circle elements with `mouseover` and `mouseout` events to trigger the tooltip’s opacity transitions. The chart includes labeled axes with tick marks to facilitate comparison of seismic activity patterns.

MMTClass
80% match
Loading thumbnail…

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.

JJunying Li
80% match
Loading thumbnail…

Ver02 of Magnitude of Earthquakes over 7 Days

This scatter plot displays the magnitude and timing of earthquakes over a seven-day period, with depth categorized into shallow, intermediate, and deep levels using red, blue, and green from a D3 ordinal scale. The visualization uses `scaleTime` for the x-axis and `scaleLinear` for the y-axis, rendering circles with fill colors derived from depth categories. A legend generated via SVG groups clarifies the color mapping, while the code imports utilities from `@curran/axis-labels` and loads earthquake data from `@Ljz2018/earthquake`.

Llingjizhu@gmail.com
80% 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
79% match
Loading thumbnail…

Ver04 of Magnitude of Earthquakes over 7 Days

A scatter plot visualizes earthquake magnitude and depth from the past seven days, using time on the x-axis and magnitude on the y-axis. The depth is categorized into three levels—shallow (red), intermediate (blue), and deep (green)—via `d3.scaleOrdinal`. The visualization uses `d3.scaleTime` and `d3.scaleLinear` to map axes, with circles colored by depth and a hover interaction that enlarges points and displays crosshair lines. It leverages the d3 library, integrates responsive container and axis handling, and sources data from the Earthquake Dataset.

Llingjizhu@gmail.com
79% match