Skip to main content
SimilarExport ZIP
100%

Fork of scatter plot

✓ Published2🌍 Public
Bbharathavulapati@gmail.com
Last edited Mar 25, 2025
Created on Mar 25, 2025

This fork of a scatter plot displays the relationship between Math and Science marks for a group of students, with each green circle representing one student. The visualization loads data from a CSV file and uses D3 v6’s `csv` parser to process the marks, mapping them to pixel coordinates via `scaleLinear` and `extent`. Axes are rendered with `axisLeft` and `axisBottom`, while the plot includes labeled X and Y axes and a bold title. The SVG rendering fills the browser window, with circular marks positioned using `attr` bindings for cx and cy.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fitness Data Scatter Plot

This scatter plot visualizes the relationship between students’ math and science marks, with each green circle representing one student’s paired scores. The x-axis maps math marks and the y-axis maps science marks, with axes labeled and a bold title. Built with D3 v6, the code loads a remote CSV, parses numeric values, and uses `scaleLinear`, `extent`, and `axisLeft`/`axisBottom` to render an SVG chart. The data originates from a GitHub-hosted CSV file, and the plot auto-sizes to the browser window.

Ssanthoshdachepally333@gmail.com
90% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot

This fork of a reusable D3 scatter plot displays individual student math scores against science scores from a CSV dataset, with each circle representing one student. The code builds the chart using D3 v6 APIs including `d3.csv`, `d3.scaleLinear`, `d3.axisLeft`, and `d3.axisBottom`, rendered as SVG within a full-window container. A custom `scatterPlot` generator function uses getter-setter methods to configure width, height, data, margins, and circle radius, while the axes and labels are added inside the chart’s rendering loop.

Bbharathavulapati@gmail.com
88% match
Loading thumbnail…

Fork of Fork of Fork of scatter plot

A forked D3.js v7 scatter plot visualizes the relationship between Math and Science scores for students in a CSV dataset, with points colored by academic department. It uses `d3.csv` to load data, `d3.scaleLinear` for axes, and `d3.scaleOrdinal` with `d3.schemeSet2` for categorical coloring. Points are rendered as SVG circles with hover tooltips, alongside a legend identifying departments.

Ssainishanthreddyk@gmail.com
88% match
Loading thumbnail…

Fork of Fork of scatter plot

This scatter plot visualizes the relationship between math and science scores for 50+ students, with each dot colored by academic department. It uses d3.csv to load the dataset, d3.scaleLinear for x and y axes, and d3.scaleOrdinal with d3.schemeSet2 for color encoding. Interactive tooltips appear on hover via appended title elements, while a manually constructed SVG legend identifies department categories. The visualization employs d3.axisBottom and d3.axisLeft to render axes, with SVG circles serving as the primary glyphs.

Ssainishanthreddyk@gmail.com
87% match
Loading thumbnail…

Fork of scatter plot

This scatter plot visualizes the relationship between math and science scores for 93 students, with each dot colored by department. It uses D3.js v7 to load data from a CSV file, map scores to x/y coordinates with `d3.scaleLinear()`, and color-code points using `d3.scaleOrdinal()` with the `d3.schemeSet2` palette. The SVG rendering includes axes via `d3.axisBottom` and `d3.axisLeft`, plus a legend identifying the seven academic departments. Hovering reveals a tooltip with the student's name, department, and scores.

Ssainishanthreddyk@gmail.com
87% match
Loading thumbnail…

Fork of Line Chart

This fork of a line chart visualizes the relationship between Maths and Science marks for a dataset. It renders a single red line path connecting data points, with a time-scaled X axis for Maths and a linear Y axis for Science, using d3.scaleTime, d3.scaleLinear, d3.axisBottom, d3.axisLeft, and d3.line. The SVG output is 960 by 500 pixels, with labeled axes and a title, using data loaded from a CSV file via d3.csv.

SSnarasimhap
81% match
Loading thumbnail…

Fork of Fork of Fork of Reusable D3 Scatter Plot

This reusable scatter plot, written with D3 version 6, displays a set of numeric x/y data points as steelblue circles. The example fetches its data from a JSON file hosted in a GitHub gist, then maps the raw values to numbers. It builds an SVG canvas and uses `d3.scaleLinear` with `d3.extent` to compute the axes, which are rendered with `d3.axisBottom` and `d3.axisLeft`. The chart includes labeled X and Y axes, with the plotting logic encapsulated in a function for reuse.

Bbhargavinalamothu@gmail.com
81% match
Loading thumbnail…

Fork of Reusable D3 Scatter Plot

This example visualizes the relationship between student population and student-to-staff ratio in a scatter plot, with each circle representing a university. It loads CSV data from a GitHub URL, parses it, and maps the selected columns to x and y positions using D3’s `scaleLinear`. The chart uses `axisBottom` and `axisLeft` for axes, while circle colors come from `scaleOrdinal` (though the color mapping is static to species names not present in this dataset). The reusable `scatterPlot` function encapsulates the chart’s configuration, and SVG rendering is used throughout.

Ssagamreddy929@gmail.com
80% match