Skip to main content
SimilarExport ZIP
100%

Line chart - Average grade by age

✓ Published0🌍 Public
Mmichael_chuxs@yahoo.com
Last edited May 30, 2026
Created on May 30, 2026

Three overlaid line charts compare average student grades by age across three metrics: grades before AI use, grades after AI use, and the calculated grade change. The line chart groups a CSV dataset by age and computes mean values for each category using `d3.rollup` and `d3.mean`. Lines are drawn with `d3.line` and a point scale, while circles with tooltips and a color-coded legend clarify each series. The SVG is rendered with D3 v7 and includes rotated x-axis labels to accommodate age values.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Fork of Fork of Fork of Fork of React & D3 Starter LINE cHART

This line chart compares average student grades before and after AI usage across age groups, using two colored lines with circular markers for each data point. Hovering over a marker displays a tooltip with the exact age and grade value. The visualization loads CSV data from a GitHub repository, processes it with `d3.rollups` and `d3.mean` to aggregate averages per age, and renders the chart as SVG using `d3.line`, `d3.scaleLinear`, and `d3.axisBottom`/`d3.axisLeft`. A custom legend distinguishes the two grade series.

Mmichael_chuxs@yahoo.com
84% match
Loading thumbnail…

Fork of Average Grade Improvement by AI Tool - TEST

This fork of a D3.js dashboard visualizes student performance data from a CSV file, comparing average grades before and after AI usage across age groups in a line chart, and the average grade improvement by different AI tools in a bar chart. The visualization uses D3 v7 APIs including `d3.csv`, `d3.group`, `d3.mean`, `d3.scaleLinear`, and `d3.line` to load, clean, and render the data as SVG. The interactive dashboard displays the data in a two-column grid layout with styled cards.

Mmichael_chuxs@yahoo.com
79% match
Loading thumbnail…

visualization7D3.js

This multi-line chart displays the average first-semester grade by age at enrollment, with separate lines for male and female students. The visualization uses D3.js v7 to load the dataset via `d3.csv`, clean and aggregate the data with `d3.rollups` and `d3.mean`, and render the chart as an SVG. Points along each line include interactive tooltips showing gender, age, and average grade. Axes are generated with `d3.axisBottom` and `d3.axisLeft`, and a legend distinguishes the two gender groups.

GGanesh Gundekarla
77% match
Loading thumbnail…

Line chart - ICE 7

A line chart compares average math scores between male and female students across six parental education levels, from some high school to master’s degree. It shows that scores generally rise with education level, with females slightly outperforming males at most levels. The visualization loads the CSV data with d3.csv, aggregates using d3.rollups and d3.mean, and renders an SVG via d3.axisBottom, d3.axisLeft, and d3.line. Point markers include tooltips with exact averages, and a legend distinguishes the two gender lines.

Ssravya010
77% 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 - Study Hours vs Grade Change

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.

Mmichael_chuxs@yahoo.com
76% match
Loading thumbnail…

Fork of Fork of React & D3 Starter

A bar chart compares average grade improvement across AI tool purposes, with each bar height representing the mean grade change for that category. The chart highlights how different reasons for using AI correspond to varying academic outcomes. Built with D3 v7, it loads CSV data via `d3.csv`, aggregates values using `d3.rollups` and `d3.mean`, and scales axes with `d3.scaleBand` and `d3.scaleLinear`. Rendered as SVG, bars include hover tooltips for detail, and the chart is sorted from highest to lowest average improvement.

Mmichael_chuxs@yahoo.com
76% match
Loading thumbnail…

Line Chart

This line chart visualizes student growth rates from 1980 to 2005, with years on the x-axis and growth rate on the y-axis. The chart uses d3.csv to load external data, then d3.scaleTime and d3.scaleLinear for axes, d3.axisBottom and d3.axisLeft for ticks, and d3.line with d3.extent and d3.max for path generation. Rendered as SVG, the chart includes axis labels and a title, with the line path styled in red via CSS.

SSravaniPosina
75% match