Skip to main content
SimilarExport ZIP
100%

Scatterplot

✓ Published0🌍 Public
FFremont
Last edited Apr 30, 2024
Created on Apr 30, 2024

This example displays a scatterplot of penguin measurements, plotting flipper length on the x-axis against body mass on the y-axis for each individual in the dataset. The plot uses a simple grid background with an inset margin to frame the points. It is built using the Observable Plot library, with the `Plot.dot` mark generating the circles from data imported from a CSV file hosted on GitHub.

AI-generated description

This example was ported from Observable: Scatterplot.

MIT Licensed

Similar vizzes

Loading thumbnail…

Observable Plot Scatterplot

This example uses Observable Plot to render a scatterplot of penguin measurements, with flipper length on the x-axis and body mass on the y-axis. The plot includes a grid, an inset margin, and automatically sizes to fit its container. The code imports the `Plot` library and a penguins dataset, then calls `Plot.plot` with a `Plot.dot` mark to visualize the data.

CCurran Kelleher
90% match
Loading thumbnail…

Observable Plot Scatterplot with Color

This example displays a scatterplot of penguin measurements, with each dot positioned by flipper length and body mass, and colored by species. Built using Observable Plot’s `Plot.plot` API, it renders dots via `Plot.dot` and includes a legend, grid, and margins configured through the `color` and `inset` options. The chart reads data from the `@curran/penguins` package and dynamically resizes to its container’s dimensions.

CCurran Kelleher
86% match
Loading thumbnail…

Scatter Plot

This scatter plot visualizes penguin measurements, showing flipper length against body mass, with each point colored by species (Adelie, Gentoo, or Chinstrap). Circle radii are also mapped to bill measurements. The visualization uses D3 v6 to load CSV data from a remote GitHub gist, parse numeric fields, and render an SVG with `scaleLinear` scales, `axisLeft` and `axisBottom` for axes, and `.join('circle')` to create the data points.

Ssuryavamsi00024
86% match
Loading thumbnail…

Observable Plot Scatterplot with Color

This example shows how penguin body mass and flipper length relate, with points colored by species using the Observable Plot library. It plots the penguins dataset from @curran/penguins, rendering dots with `Plot.dot` and mapping the `stroke` channel to the `species` field, while a legend appears via a `color` option. The chart is sized to its container and includes a grid and inset padding. The code also handles hot reloading by replacing the existing DOM node, and it overrides default figure margins in CSS.

CCurran Kelleher
85% match
Loading thumbnail…

Scatter Plot

This scatter plot visualizes penguin measurements, mapping flipper length to the x-axis, body mass to the y-axis, and coloring each point by species (Adelie, Gentoo, and Chinstrap). The code loads data from a CSV URL using `d3.csv`, then uses `d3.scaleLinear`, `d3.extent`, `d3.axisLeft`, and `d3.axisBottom` to build the axes. SVG circles are appended to the DOM with radius and fill attributes derived from bill dimensions and species, respectively.

LLakshmanRangisetti
85% match
Loading thumbnail…

scatter Plot

This scatter plot visualizes penguin data showing flipper length against body mass, with each point colored by species. It also encodes bill dimensions through circle position attributes, though these are not visually distinct. The visualization uses D3 v5 with SVG rendering, employing `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to map data to coordinates. Data is loaded via `csv` from a GitHub gist, and points are rendered as circles with species-based fill colors.

BBala Sai Krishna
85% match
Loading thumbnail…

Scatter Plot

This scatter plot visualizes penguin measurements, plotting flipper length against body mass for three species—Adelie, Gentoo, and Chinstrap—with each point colored by species and sized with a fixed radius. The chart also encodes bill dimensions as elliptical axes (rx and ry) on each circle, a feature unique to this example. It loads CSV data from a GitHub gist and renders SVG using D3 v6, employing `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `csv`. The code calculates plot dimensions from the window size and uses an async main function to fetch and draw the data.

Aanith462@gmail.com
85% match
Loading thumbnail…

Penguin scatter Plot

This example shows a scatter plot of penguin measurements, with flipper length on the x-axis and body mass on the y-axis, colored by species (Adelie, Gentoo, and Chinstrap). It uses D3 v5 to fetch CSV data from a GitHub gist, parse it, and render SVG circles scaled by bill length and depth within each circle's radius. The plot includes axis labels and a title, with axes generated via `d3.axisLeft` and `d3.axisBottom`.

VVAbhiram99
85% match