Scatter Plot

100%

Scatter Plot - Study Hours vs Grade Change

✓ Published0🌍 Public

Last edited May 30, 2026

Created on May 30, 2026

A scatter plot visualizes the relationship between study hours per day and grade change, with each point colored red or green to indicate whether a student uses AI. The tooltip reveals detailed attributes per student, including AI usage, tools used, and grades before and after AI. Built with D3 v7, the visualization uses `d3.scaleLinear` for axes, `d3.axisBottom` and `d3.axisLeft` for ticks, and SVG circles with mouseover events for interactivity. Data comes from a cleaned CSV file hosted on GitHub, filtered to include only valid records.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of Fork of React & D3 Starter Scatter plot

This scatter plot shows the relationship between daily study hours and grade change for students, comparing those who use AI against those who do not. The D3.js v7 code loads CSV data via `d3.csv`, filters incomplete records, and renders SVG circles colored by AI usage with an ordinal scale. Interactive tooltips appear on mouseover, while axes and a legend are generated using `d3.axisBottom`, `d3.axisLeft`, and scale functions for linear positioning.

Mmichael_chuxs@yahoo.com

84% match

Loading thumbnail…

This dark-themed scatter plot visualizes the relationship between hours studied and exam scores for 188 students, with each point colored by attendance percentage using a sequential turbo scale. The visualization loads data from a CSV file and renders it as SVG circles, employing D3 v7 scales for positioning and color encoding. Interactive tooltips display student details on hover, while grid lines and axis labels provide context for the academic performance metrics.

RRamdas Dheeraj

79% match

Loading thumbnail…

ACT6_TUT3_TASK1

This scatterplot explores the relationship between daily study hours and GPA for students across three academic tracks (CS, Data, AI). The visualization uses colored symbols—circles, squares, and triangles—to distinguish tracks, with tooltips revealing individual student details. Built with D3 v7, the chart employs `d3.scaleLinear` for both axes, `d3.scaleOrdinal` for color and shape encoding, and `d3.symbol` to generate the point markers. The data comes from a local CSV file, rendered as SVG with custom axes, title, and a legend.

RRevanth putta

77% match

Loading thumbnail…

Ice 6 Scatter_data

This scatter plot visualizes the relationship between study hours and exam scores, with each point representing a student. The chart reveals a curved pattern where scores initially rise with study hours, peak around 48 hours, then decline, suggesting diminishing returns. Built with D3 v7, the visualization loads data from a CSV file and renders circles as SVG elements. The code uses `d3.csv` to parse the data, `d3.scaleLinear` for both axes, and `d3.axisBottom` and `d3.axisLeft` to generate the scales.

HHarshithaDontha@my.unt.edu

77% match

Loading thumbnail…

Ice7 scatter plot

This scatter plot visualizes exam scores against study hours for 15 students, revealing a clear positive correlation between the two variables. Each point is labeled with its student number, and the axes include descriptive titles. The visualization uses D3 v7 to load CSV data with `d3.csv`, scales the data with `d3.scaleLinear`, and renders axes with `d3.axisBottom` and `d3.axisLeft`. The reusable `createScatterPlot` function generates an SVG with customizable colors and labels.

HHarshithaDontha@my.unt.edu

76% match

Loading thumbnail…

Module 2.2: Assignment #2

This dashboard visualizes student AI usage patterns through four coordinated D3 charts. A pie chart shows the proportion of students using AI, a bar chart compares average grade improvement across AI tools, a scatter plot explores study hours versus grade change, and a line chart displays average grades before and after AI use across student ages. The visualization uses d3.csv to load the students_ai_usage_cleaned dataset, d3.rollup for aggregation, d3.scaleOrdinal for categorical coloring, and SVG rendering with a custom tooltip for interactivity. All charts respond to hover events using the showTooltip and hideTooltip functions.

Mmichael_chuxs@yahoo.com

76% match

Loading thumbnail…

Scatter plot

This scatter plot shows the relationship between study hours and test scores using five custom data points. Each black circle represents one observation, plotted with hours on the x-axis and scores on the y-axis. The visualization uses d3’s `scaleLinear`, `extent`, `axisBottom`, and `axisLeft` within a reusable `scatterPlot` function to handle scaling, axes, and margins. The SVG rendering is configured with a fixed width of 800 and height of 500, and the chart displays labeled axes and axis tick marks.

Ggayathrisaxena23@gmail.com

76% match

Loading thumbnail…

Ice6 q2

This scatter plot visualizes the relationship between hours studied and exam scores using a dataset of student performance factors from a GitHub-hosted CSV file. It shows individual data points as orange, semi-transparent circles, with hours studied on the x-axis and exam scores on the y-axis. The visualization is built with D3 v7, using `d3.csv` to load the data, `d3.scaleLinear` for both axes, and `d3.axisBottom` and `d3.axisLeft` for tick marks. The chart is rendered as an SVG, with circles positioned using the mapped coordinates.

Hh.harrycoding@gmail.com

76% match