Skip to main content
SimilarExport ZIP
100%

Assignment 2 - Scatter Plot

✓ Published0🌍 Public
Cchsaisriharsha@gmail.com
Last edited Jul 23, 2023
Created on Jul 22, 2023

This example visualizes the Palmer Penguins dataset as a scatter plot, mapping bill length to the x-axis and bill depth to the y-axis while coloring each point by penguin species. It loads data from a CSV file and renders circles as SVG marks using D3 v6. The code defines scales with `scaleLinear`, generates axes with `axisLeft` and `axisBottom`, and includes a legend for species identification. The visualization is displayed across the full browser window with styled axis labels and customized fonts from Google Fonts.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Assignment 2 - Scatter Plot with color

This scatter plot visualizes the Palmer Penguins dataset, mapping bill length to the x-axis and bill depth to the y-axis. Each dot is color-coded by penguin species (Adelie, Gentoo, Chinstrap) using a categorical palette, with a legend positioned on the right. The visualization loads data from a CSV URL and renders using SVG circles via D3 v6, employing `d3.csv`, `d3.scaleLinear`, `d3.extent`, and the `select` API to construct axes and marks.

Ppasyasahas
95% match
Loading thumbnail…

Assignment_2 Reusable Scatter Plot

This interactive scatter plot visualizes Palmer penguin measurements, using flipper length, body mass, bill length, and bill depth as axes. The chart cycles through these four variables at timed intervals, updating the x-axis while preserving the y-axis. Colored circles represent penguin species, with a legend mapping each category to a distinct color. Built with D3.js (v6), the example demonstrates reusable chart components through local ES6 module imports, scaling axes with `scaleLinear` and rendering SVG elements with data joins. Data loads from a remote CSV file via D3's `csv` function.

Cchsaisriharsha@gmail.com
89% match
Loading thumbnail…

Assignment 2 Reusable Scatter Plot

This example visualizes the Palmer Penguins dataset with a reusable scatter plot built using D3 v6. The plot cycles through four different x-axis variables—body mass, bill depth, flipper length, and bill length—at two-second intervals while keeping bill length on the y-axis. Circles are colored by penguin species (Adelie, Gentoo, Chinstrap) with a legend and animated transitions. The code demonstrates D3’s scaleLinear, axisBottom, and axisLeft APIs, along with ES6 module imports and setInterval-driven updates.

Ppasyasahas
89% match
Loading thumbnail…

Assignemnt 2 Q3 Penguin Data set scatter Plot

This scatter plot visualizes the Palmer Penguins dataset, showing flipper length against body mass, with points colored by species (Adelie, Gentoo, or Chinstrap). The graphic is rendered as an SVG using D3 v5. The code employs `d3.csv`, `d3.scaleLinear`, `d3.extent`, and `d3.axisLeft`/`d3.axisBottom` to parse the data and draw axes. It reads data from a GitHub Gist URL. Each data point is a circle, colored via a custom `marker` function, with additional bill measurements stored as attributes on the circles, though they are not visually encoded.

VVishnu Sudireddy
88% match
Loading thumbnail…

Penguin Data set scatter Plot

A scatter plot of the Palmer Penguins dataset displays body mass on the x-axis and bill depth on the y-axis, with each circle colored by species (Adelie, Chinstrap, or Gentoo). The visualization uses D3 v5 to load CSV data via `d3.csv`, scales with `scaleLinear` and `extent`, and renders circles as SVG elements. Axes are generated with `axisLeft` and `axisBottom`, while custom styling applies cursive fonts and a bold title.

Ssyedhaliz
87% match
Loading thumbnail…

Untitled

This example visualizes the Palmer Penguins dataset as an interactive scatter plot, mapping bill length and bill depth along the x- and y-axes. The visualization uses D3 version 6 to load CSV data and bind it to SVG elements, with circles representing individual penguins. The code explicitly parses numeric fields for bill dimensions, flipper length, and body mass, enabling quantitative scaling and positioning. Axis tick styling and a fixed-viewport layout are defined in embedded CSS, while the included video tutorial demonstrates the setup process for D3 v6.

SSaiipriiya
87% match
Loading thumbnail…

Scatter Plot for Penguin Dataset

This scatter plot visualizes the Palmer Penguins dataset, showing flipper length on the x-axis and bill length on the y-axis. Colored circles represent three penguin species (Adelie, Gentoo, and Chinstrap), with each point's radius and shape also encoding bill dimensions. The visualization uses D3 v5's `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` APIs to load data, map scales, and render SVG axes. Circles are appended via D3 selections, with species-based color mapping defined through a switch statement. The chart includes labeled axes and a title, rendered in a full-window SVG using React-free vanilla JavaScript.

Aakhilgupta11
87% match
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
87% match