Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Assignment 7-Part 4- Area chart

Public visualization

Viewing a saved revision (read-only)

9f32431214b147aca047f952dda103e9

Assignment 7-Part 4- Area chart

0 stars0🌍 Public
AAriful Hasan
Last edited Mar 29, 2026
Created on Mar 29, 2026

This area chart visualizes the relationship between hours of study and average math scores, showing a clear positive trend. The D3.js visualization uses `d3.csv` to load the student_scores.csv dataset, then employs `d3.rollup` to group the data by study hours and calculate the mean math score using `d3.mean`. The chart is rendered as an SVG using `d3.area` to create the filled region, with blue fill and stroke, orange circles marking individual data points, and axes created via `d3.axisBottom` and `d3.axisLeft`. The visualization includes labeled axes and a title, with scales defined by `d3.scaleLinear` and domain adjustments using `d3.extent` and `d3.max`.

AI-generated description

Area Chart - Assignment 7

This project shows an area chart using D3.js.

Dataset

File used: student_scores.csv

Visualization

  • X-axis: Hours of Study
  • Y-axis: Average Math Score

Explanation

This chart shows how the average Math score changes with study hours. The filled area helps show the magnitude of the values.

Author

Ariful Hasan