Export Image

Saiteja_ICE5

KST16

0 views in last 90 days
Last edited Feb 28, 2026
Created on Feb 28, 2026
Forked from D3 Starter

Yes — and you should. A proper README.md makes this look like an intentional mini project instead of “just an assignment.”

But don’t write fluff. Keep it structured, clean, and technical.

Here’s a strong, human, academic-style README you can paste directly into README.md in VizHub:


📊 ICE-5: Digital Distraction Dataset Visualization

Overview

This project demonstrates loading and analyzing a CSV ataset using D3.js. he dataset represents synthetic igital behavior records including app usage time, sleep ours, device information, and social media platform ctivity.

The CSV file is hosted publicly via a GitHub Gist RAW link nd is dynamically loaded into the visualization using fetch()`.


Dataset Information

*-File Type: CSV *-Rows: 150 *-Columns: 12 *-Key Attributes:

*-app_usage_time *-sleep_hours *-social_media_platform *-device_brand *-location *-mood_score

The dataset was generated using Mockaroo to simulate ealistic digital usage patterns.


Implementation Details

This visualization uses:

*-D3.js (v7) for:

*-Parsing CSV (d3.csvParse) *-Data aggregation (d3.rollups) *-SVG rendering (bar chart) * -Native JavaScript fetch() for data loading *-HTML + CSS for layout and styling


Features Implemented

✔ Dataset metadata summary Computed KPIs:

*-File size (KB) *-Rows × Columns *-Average app usage time *-Average sleep hours *-Most common social media platform ✔ SVG bar chart showing platform distribution ✔ Scrollable preview table (first 8 rows)


How It Works

  1. The CSV is fetched from a public GitHub Gist RAW URL.
  2. The CSV text is parsed into structured data using D3.
  3. Summary statistics are computed.
  4. Platform frequency counts are aggregated.
  5. An SVG bar chart is rendered dynamically.

Technical Learning Objectives

This project demonstrates:

*-Client-side data loading from remote sources *-Data parsing and transformation *-Aggregation using D3 utilities *-Basic SVG chart construction *-Dynamic DOM updates


Author

Saiteja

MIT Licensed