Skip to main content
SimilarExport ZIP
100%

Assignment Q1

✓ Published0🌍 Public
BBhargav Reddy
Last edited Oct 27, 2025
Created on Oct 27, 2025
Forked from D3 Starter

A reusable scatter plot compares math and reading scores, with each student’s gender indicated by color. The visualization uses D3 v7’s `d3.csv` and `d3.autoType` to load the data, `scaleLinear` for axes, and `scaleOrdinal` for color mapping. Hovering reveals a tooltip with gender and scores, while an adjacent legend clarifies the encoding. The plot is rendered as SVG circles with `mouseover` and `mouseout` event handlers, demonstrating a modular chart-building pattern common in D3 examples.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Question 3

A scatter plot shows the relationship between math and reading scores for students, with points colored by gender (blue for male, pink for female). Both axes range from 50 to 100, and the plot uses an ordinal color scale to distinguish genders. The visualization loads data from a CSV file via `d3.csv`, converts numeric fields with unary plus, and renders SVG circles using `d3.scaleLinear` for positioning and `d3.axisBottom`/`d3.axisLeft` for axes. Axis labels are added as SVG text elements.

Ppavanbellam@my.unt.edu
87% match
Loading thumbnail…

Assignment q2

This visualization displays a pie chart comparing average total scores by gender, computed from the StudentsPerformance 2.csv dataset. It uses D3 v7’s `d3.pie` and `d3.arc` to generate slices, with each gender’s average of math, reading, and writing scores aggregated via `d3.group` and `d3.mean`. The SVG rendering includes animated slice transitions through `transition.attrTween`, hover tooltips, and a legend, with a blue-red color scale distinguishing male and female results.

BBhargav Reddy
85% match
Loading thumbnail…

Activity6_Task3.3

This scatter plot visualizes student performance by mapping math scores on the x-axis and reading scores on the y-axis, with each circle colored by gender (skyblue for female, lightgreen for male). The visualization uses D3 v6 APIs including `csv`, `scaleLinear`, `axisLeft`, `axisBottom`, and `select` to load data from a GitHub-hosted CSV and render SVG circles. Additional attributes for writing score and test preparation are stored but not visually encoded, while axis labels appear in green.

Ss.harshinisai01@gmail.com
84% match
Loading thumbnail…

Activity 6 Question 3

A scatter plot displays the relationship between Math and English scores for students, with each circle colored by gender (steelblue for male, deeppink for female). The visualization uses D3 v7's `scaleLinear` for axes, `d3.extent` for domain calculation, and `d3.scaleOrdinal` for color mapping. It renders as an SVG with a legend, axis labels, and a title, loading data from a remote CSV file via `d3.csv`.

Aanisha.peddireddy@gmail.com
83% match
Loading thumbnail…

Activity 6 Question 3

This scatter plot visualizes the relationship between Math and English scores for individual students, with points colored by gender (steelblue for males, deeppink for females). It uses the D3.js library (v7) to load a CSV dataset from GitHub, apply linear scales to both axes, and render the chart as SVG. The visualization includes labeled axes, a purple title, and a legend, all positioned using calculated margins. The code leverages `d3.scaleLinear`, `d3.extent`, `d3.scaleOrdinal`, and `d3.axisBottom`/`d3.axisLeft` to construct the plot, with circles appended via `g.selectAll('circle').data(data).join('circle')`.

Ssagipavan2385@gmail.com
83% match
Loading thumbnail…

Reusable Scatter plot - ICE 7

This reusable scatter plot compares math and reading scores from the StudentsPerformance.csv dataset, with gender distinguishing the data points by color. The chart uses d3.v7 to implement a modular scatterPlot() function with configurable accessor methods for x, y, color, and axis labels. D3’s scaleLinear, scaleOrdinal, and schemeTableau10 power the axes and color encoding, while hover tooltips display each point’s exact values. The legend, axes, and dots are rendered dynamically within an SVG container, following D3’s data-join pattern for reusable chart components.

Ssravya010
83% match
Loading thumbnail…

Assignment 7

This reusable D3.js scatter plot visualizes the relationship between math and physics scores for 40 students, with points colored by group membership. The chart uses `d3.csv` to load the dataset and custom scales via `d3.scaleLinear` for both axes and `d3.scaleOrdinal` for the categorical color encoding. The reusable function accepts parameters for data, axis value accessors, labels, dimensions, and title, rendering the chart as SVG with axes, labels, a legend, and semi-transparent circles. This design allows the same function to be applied to different datasets and attributes without modification.

AAriful Hasan
83% match
Loading thumbnail…

one

A reusable D3.js scatter plot visualizes student performance, mapping study hours on the x-axis and test scores on the y-axis, with circles colored by gender (blue for Male, pink for Female). Built with d3.v7, it uses `d3.scaleLinear` for axes, `d3.scaleOrdinal` for color encoding, and `d3.axisBottom`/`d3.axisLeft` for tick marks. The chart loads `students.csv` via `d3.csv` and appends `title` elements for tooltips, rendering as SVG with margins and labeled axes.

Mmsahithipatel@gmail.com
82% match