Skip to main content
SimilarExport ZIP
100%

Activity6_Task3.2

✓ Published0🌍 Public
Nnissisharon61@gmail.com
Last edited Mar 31, 2025
Created on Mar 31, 2025
Forked from HTML Starter

This scatter plot shows student age and course, with symbols encoding the year of study for each data point. Using D3.js v7, the visualization maps age on the x-axis and course on the y-axis, replacing standard points with circles, squares, triangles, and diamonds for Years 1–4. Data is loaded from a CSV via `d3.csv` and rendered as SVG, with axes generated by `d3.axisBottom` and `d3.axisLeft`. Hovering reveals a tooltip with detailed information about each student.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Task3.1

This scatter plot visualizes survey data from university students, showing the relationship between each respondent's age and their course of study, with points colored by their year of study (Year 1 through Year 4). The visualization uses D3.js v7 to load a CSV file from a GitHub gist and render an SVG chart with a linear x-axis for age and a point scale y-axis for course names. The code applies d3.scaleLinear, d3.scalePoint, and d3.scaleOrdinal to position and color the circles, while interactive tooltips appear on mouseover to display the exact age, course, and year for each data point.

Nnissisharon61@gmail.com
93% match
Loading thumbnail…

activity6_Task4

This visualization is a bubble chart that shows the relationship between student age, course, CGPA, and year of study, using data from a mental health survey. The x-axis maps age, the y-axis maps course, bubble size represents CGPA, and color distinguishes year of study. D3 v7 API calls such as `scaleLinear`, `scalePoint`, and `scaleOrdinal` are used to position and style the circles, while `d3.csv` loads the data and `d3.axisBottom` and `d3.axisLeft` render the axes. The chart is rendered as an SVG with a tooltip for interactivity.

Nnissisharon61@gmail.com
87% match
Loading thumbnail…

Activity6_Task3

This scatter plot visualizes student grades, with English on the x-axis, physics on the y-axis, and points colored by class category (First, Second, or other). It uses D3 v6’s `csv`, `scaleLinear`, `extent`, `axisLeft`, and `axisBottom` to load and scale the data from a GitHub-hosted CSV and render axes. The plot is drawn as SVG circles with fixed radius, while additional science and math values are stored per mark but not visually encoded.

Hhemanthmaddila13@gmail.com
81% match
Loading thumbnail…

Activity8Task3.1

This interactive scatter plot visualizes the relationship between age and height for a dataset with categorical color coding. Points are colored skyblue, lightgreen, or orange based on their category, with gray as the default fallback. The visualization loads CSV data from a GitHub gist using the `csv` function, then maps values to screen coordinates with `scaleLinear` and `extent`. It renders SVG circles using `selectAll` with the `join` operator, and displays labeled axes via `axisLeft` and `axisBottom`. The plot dynamically fills the browser window with margins defined for the chart area.

Ssirichandana017@gmail.com
81% match
Loading thumbnail…

Visualization6D3.js

This scatter plot visualizes the relationship between student age at enrollment and first-semester grade, with points colored according to gender and retention status (retained versus dropped). Each dot encodes a single student record from the dataset, and hovering reveals precise age, grade, and gender values through a tooltip. The visualization uses D3 v7 with SVG rendering, employing `d3.scaleLinear` for the x and y axes, `d3.scaleOrdinal` for categorical coloring, and `d3.axisBottom` and `d3.axisLeft` for the coordinate system. A static HTML legend outside the SVG explains the four color-coded groups.

GGanesh Gundekarla
81% match
Loading thumbnail…

phase2Visualization3

This example presents a static D3.js (v7) SVG scatter plot that visualizes the relationship between a student's age at enrollment and their first-semester grade, with data points colored by retention status (Retained, Dropped, or Enrolled). The visualization uses the `d3.csv` data loading API to read the dataset and the `d3.scaleLinear` and `d3.scaleOrdinal` functions to map age and grade to x/y coordinates and retention status to color. Hovering over a circle triggers a mouseover event that uses the `d3.select` API to show a tooltip with the exact age, grade, and status values. The chart includes labeled x- and y-axes ('Age at Enrollment' and '1st Semester Grade') generated using the `d3.axisBottom` and `d3.axisLeft` APIs.

GGanesh Gundekarla
81% match
Loading thumbnail…

Activity6_task3_3

This scatter plot visualizes the relationship between age and weight from a synthetic health dataset. The visualization encodes each data point as a circle, with position determined by age on the x-axis and weight on the y-axis. The chart uses d3.scaleLinear for both axes and d3.axisBottom/axisLeft to render tick marks. The code colors points based on gender using d3.scaleOrdinal and includes a shapeLegend function that displays the color mapping. The data is loaded via d3.csv from a GitHub-hosted CSV file and rendered as SVG elements.

Vvemurisuchitha@gmail.com
81% match
Loading thumbnail…

Scatter Plot

A scatter plot visualizes the relationship between student age and exam marks across various university courses. Each point represents an average mark for a specific age group within a course, with the x-axis scaled linearly and the y-axis using a band scale for discrete age values. The visualization uses D3 v5's `scaleLinear`, `scaleBand`, `axisBottom`, and `axisLeft` to construct the SVG chart, with margins and formatting applied to the axes. Data comes from a CSV file containing department, course, age, attendance, and marks columns.

Ppillliarun79
80% match