Fork of reusable Scatter Plot

100%

Fork of reusable Scatter Plot

✓ Published0🌍 Public

Last edited Mar 28, 2024

Created on Mar 28, 2024

This fork of the classic scatter plot visualizes the Palmer Penguins dataset, encoding each penguin as a point in a 2D space. The plot maps bill length and bill depth on the x- and y-axes, with points colored by species and shaped by sex, while the island of origin is encoded through point color intensity. The SVG-rendered chart uses a light grid, axis labels, and a legend to distinguish the three penguin species across multiple categorical dimensions. The example is built with the v3 Observable runtime and released under the MIT license.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Simple Scatter Plot

This example visualizes the Palmer Penguins dataset, plotting bill length against flipper length for individual penguins. The scatter plot encodes each penguin as a semi-transparent circle, revealing the distribution and correlation between the two measured traits across species. The visualization is built using D3.js, leveraging `scaleLinear`, `axisLeft`, and `extent` to construct scales and axes, while custom axis-label functions from `@curran/axis-labels` add annotations. A light gray background rectangle highlights the plotting area. The code dynamically computes scales from the data extents and uses SVG joins to render circles, axes, and labels, with margins and dimensions set to fit the container.

Ssridhardubala106@gmail.com

90% match

Loading thumbnail…

Fork of Simple Scatter Plot

This example visualizes the Palmer Penguins dataset, plotting bill length on the x-axis against flipper length on the y-axis using a simple scatter plot. The internal chart area is rendered as a gray rectangle, with labeled axes and semi-transparent circles representing individual penguins. Built with D3, the code uses `scaleLinear`, `extent`, `axisLeft`, and custom axis-label helpers from the `@curran/axis-labels` library to construct the visualization. Data comes from the `@curran/penguins` import and is drawn into a dynamic SVG sized to the container.

Aanishbudhi@gmail.com

89% match

Loading thumbnail…

Fork of Penguin Scatter Plot (Part 2)

This fork of a Penguin scatter plot compares bill length and bill depth for Palmer Archipelago penguins, with point radius encoding body mass and color encoding species. The visualization uses D3.js to build the scatterplot, drawing axes with `axisLeft`/`axisBottom` and a static gray plot area. Data comes from the `@subh3ndu/penguins` package, and circles are rendered with fixed radius instead of using the computed scale, showing a deliberate modification of the original example.

SSubhendu Karmakar

87% match

Loading thumbnail…

Fork of Penguin Data set scatter Plot

This scatter plot visualizes the Palmer Penguins dataset, mapping flipper length against body mass for individual penguins. Each point is colored by species, with circle radii fixed while bill length and depth influence visual encoding through non-standard `rx` and `ry` attributes. The visualization is rendered as an SVG using D3 v5 within a React-free HTML page. It loads CSV data asynchronously, applies linear scales via `scaleLinear`, and generates axes using `axisLeft` and `axisBottom`, with custom cursive font styling.

Ggeethikal

87% match

Loading thumbnail…

Fork of Penguin Data set scatter Plot

This visualization is a scatter plot of the Palmer Penguins dataset, showing flipper length on the x-axis and body mass on the y-axis. Each circle’s color encodes the penguin species (Adelie, Gentoo, or Chinstrap), while the circle’s fill attributes of `rx` and `ry` are set to the raw bill length and bill depth values, though the visual radius remains constant. The code uses D3 v5’s `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to load data and render SVG axes. The background is the browser window, and the plot includes cursive font labels for both axes.

Vvamshisoletii

86% match

Loading thumbnail…

Fork of Simple Scatter Plot

This scatter plot visualizes the Penguins dataset from @curran/penguins, mapping bill length against flipper length. It uses D3 scales (scaleLinear), axis-labels from @curran/axis-labels, and SVGs rendered via d3.select. Points are drawn as circles with fixed radius and opacity, positioned using the xValue and yValue accessors. The inner rectangle fill and margins define the chart’s layout. The code is a fork meant for adaptation to other datasets.

Eeschuman20@gmail.com

86% match

Loading thumbnail…

Fork of Penguin Data set scatter Plot

This fork visualizes the Palmer Penguins dataset as an SVG scatter plot, mapping flipper length to the x-axis and body mass to the y-axis. Circles are colored by species (yellow for Adelie, green for Gentoo, brown for Chinstrap) using a custom `marker` function. The code uses D3 v5 APIs including `csv`, `scaleLinear`, `extent`, `axisLeft`, `axisBottom`, and `selectAll().join()`. Data is loaded from a remote CSV URL with numeric parsing for measured traits, and the visualization fills the browser window with margins and a title.

SSaiipriiya

86% match

Loading thumbnail…

Fork of 3D Scatter Plot with Penguin Dataset

This example displays a 3D scatter plot of the Palmer Penguins dataset, plotting bill length and bill depth on the x and y axes, with the z-axis left unspecified (empty string). Each penguin is represented by a marker, with fixed size, partial opacity, and thin grey outlines. The visualization is built using the Plotly.js library (via the `Plotly.newPlot` function) within a React page, while the data is loaded asynchronously from a remote CSV file using `d3.csv`. The chart is rendered inside a dedicated `<div>` with margins zeroed out for a clean, immersive view.

RRupeshGandham

86% match