Fork of Average Grade Improvement by AI Tool - TEST

100%

Fork of Average Grade Improvement by AI Tool - TEST

✓ Published0🌍 Public

Last edited Jun 10, 2026

Created on Jun 10, 2026

Forked from Average Grade Improvement by AI Tool - Bar Chart

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.

AI-generated description

MIT Licensed

Similar vizzes

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

87% match

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

82% match

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

81% match

Loading thumbnail…

Average Grade Improvement by AI Tool - Bar Chart

This bar chart visualizes the average grade improvement for students who used different AI tools, including Copilot, ChatGPT, and Gemini. It compares these tools by calculating the mean difference between grades before and after AI usage from the `students_ai_usage.csv` dataset. The chart is rendered as an SVG using d3.v7, with `scaleBand` and `scaleLinear` for axes, and `rollup` and `mean` for data aggregation. Bars are colored purple, and hovering changes the fill to orange.

Mmichael_chuxs@yahoo.com

80% 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

80% match

Loading thumbnail…

Line chart - Average grade by age

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.

Mmichael_chuxs@yahoo.com

79% match

Loading thumbnail…

Fork of Fork of React & D3 Starter

This dashboard visualizes student AI usage data, showing how study habits, grades, and screen time relate to the adoption of tools like ChatGPT, Copilot, and Gemini. It presents four coordinated views—a pie chart, bar chart, scatter plot, and line chart—built with React 19 and D3 v7. Data is loaded from a remote CSV using `d3.csv` and processed with D3's array methods. Each chart is rendered by separate functions, `drawPieChart`, `drawBarChart`, `drawScatterPlot`, and `drawLineChart`, which use D3 selections and scales to encode the dataset's variables.

Mmichael_chuxs@yahoo.com

76% match

Loading thumbnail…

Assignment #2 Building Dashboard

This dashboard visualizes how AI tool usage relates to productivity and work/study hours among students and professionals, using a dataset from Kaggle. It presents four interactive charts: a bar chart showing AI tool popularity, a pie chart for user type distribution, a line chart for productivity against work/study hours, and a scatter plot of AI usage versus productivity. Built with D3.js v7, the visualization uses SVG rendering and employs `d3.rollup` for data aggregation, `d3.scaleBand` and `d3.scaleLinear` for scales, and `d3.axisBottom` for axes. The code handles missing numeric values by substituting column means and filters out incomplete categorical rows before rendering.

AAwrng

74% match