Fork of Dinosaur D3 Scatter Plot

100%

Fork of Dinosaur D3 Scatter Plot

✓ Published0🌍 Public

Last edited May 8, 2021

Created on May 8, 2021

A scatterplot of dinosaur length versus weight, with each circle representing a dinosaur specimen. Hovering over a point reveals its genus, period, diet type, and measurements via an SVG `<title>` element. The visualization uses d3.json to load data, d3.scaleLinear for the axes, and d3.axisLeft/axisBottom for ticks. Rendered with SVG circles and D3 v6, data comes from the Natural History Museum's Dinosaur Directory dataset.

AI-generated description

A scatterplot of the length (x-axis) vs. the weight (y-axis) of dinosaurs.

Hover over each plot for further details about the dinosaur.

Uses the Dinosaur Directory Dataset, courtesy of the Natural History Museum, London (nhm.ac.uk)

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Dinosaur D3 Scatter Plot

A scatterplot of dinosaur length versus weight, plotted with D3 scales and axes. Each point is a circle positioned by `d3.scaleLinear` domains, with an SVG `<title>` tooltip revealing the genus, period, diet type, length, and weight on hover. Data comes from a JSON dataset via `d3.json`, parsed with a custom row-accessor, and rendered using SVG circles and `d3.axisLeft`/`d3.axisBottom`. Values are formatted with `d3.format` for comma-separated weight labels.

Hharika-1929

95% match

Loading thumbnail…

Dinosaur D3 Scatter Plot

This scatter plot visualizes dinosaur length against weight, with each point representing a species and hovering revealing its genus, period, diet, and measurements. Using D3 v6, the code loads JSON data from a GitHub gist via `d3.json`, parses numeric fields, scales axes with `scaleLinear`, and renders circles in an SVG. Axis labels are generated with `axisLeft` and `axisBottom`, while `d3.format` handles comma-separated weight values. The dataset originates from the Natural History Museum, London.

AAdil Zeshan

93% match

Loading thumbnail…

Fork of Penguins Dataset Scatter Plot

This fork of the Penguins Dataset Scatter Plot visualizes the relationship between flipper length and body mass for three penguin species, with each species color-coded. Built with D3 v6 and rendered as SVG, it uses `d3.csv` to load the data, `scaleLinear` and `extent` for scales, and `axisLeft`/`axisBottom` for axes. The code also parses additional measurements but does not use them for positioning. The plot is drawn with `circle` elements, and the chart fills the browser window.

Ssnehareddygurram

76% match

Loading thumbnail…

Fork of Penguin Dataset Scatter Plot

This fork of the Penguin Dataset scatter plot visualizes flipper length against body mass, with points colored by penguin species and scaled by culmen dimensions. The code loads data via `d3.csv`, parses numeric fields, and renders an SVG using `d3.select`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom`. Circles are positioned with `cx` and `cy`, colored by a species-based marker function, and styled with radius, `rx`, and `ry` attributes. The chart includes labeled axes and a title, sized to the window.

Bbhanuteja1807@gmail.com

75% match

Loading thumbnail…

Fork of Fork of HTML Starter

This interactive scatter plot visualizes wildlife data, mapping animal weight, altitude, population density, and temperature. The visualization cycles through different x-axis variables every second, allowing dynamic exploration of relationships between ecological metrics. Built with D3 v6, it uses scalable vector graphics (SVG) rendering with ordinal symbol scales to distinguish habitats, while circle sizes encode age-specific differences. The code implements reusable chart functions with configurable accessors, and animates transitions by updating scales and redrawing marks. Data originates from a CSV file loaded via D3’s CSV parser, with axes and symbols rendered using D3’s scale and shape generators.

NNandini Maddula

75% match

Loading thumbnail…

Fork of Penguin Data set scatter Plot

This scatter plot visualizes penguin measurements, showing body mass against flipper length for three species, distinguished by color. Each circle encodes additional dimensions through its radius and the culmen length and depth values. The visualization uses D3 v5’s `csv` loader, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to map data from a GitHub-hosted CSV to SVG circles. Custom tick fonts, axis labels, and a title styling enhance readability, while the plot resizes to the full window.

NNikitha123171

75% match

Loading thumbnail…

Fork of Fork of Penguin Data set scatter Plot

This interactive scatter plot visualizes penguin measurements, mapping flipper length to the x-axis, body mass to the y-axis, and using circle color to distinguish species (Adelie, Gentoo, and Chinstrap). The SVG-based visualization uses d3.csv to load data, d3.scaleLinear and d3.extent for scaling, and d3.axisLeft/axisBottom for axes. Each circle’s rx and ry attributes are set from bill dimensions, creating an elliptical distortion, while d3.selectAll().join() manages the marks. Axis labels and a title are added via SVG text elements.

Vvryvarma5577@gmail.com

75% match

Loading thumbnail…

Fork of Fork of Reusable D3 Scatter Plot

This scatter plot visualizes the Palmer Penguins dataset, mapping body mass against culmen length with an animated loop that cycles through four numerical attributes every two seconds. Built with D3 v6, it uses reusable chart patterns via a custom `scatterPlot` function, `scaleLinear` for axes, and `axisLeft`/`axisBottom` for ticks. The SVG rendering updates in place using `selectAll` and `join`, while `setInterval` triggers re-renders to switch the x-axis variable, showcasing the flexibility of modular chart components.

RRahulChaitu999

74% match