Skip to main content
SimilarExport ZIP
100%

Activity7:Question:2

✓ Published1🌍 Public
Ssaivaishnogaruda@gmail.com
Last edited Nov 1, 2024
Created on Nov 1, 2024

This area chart displays total app usage hours across six age groups, from users under 20 to those 50 and older. The visualization aggregates individual user data by binning ages and summing their reported usage hours. Built with D3 v7, the chart uses d3.group to categorize the dataset, d3.scaleBand and d3.scaleLinear for positioning, and d3.area to generate the filled path rendered as SVG. The visualization includes labeled axes for age groups and usage hours, with a title and light gray background.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Activity7:Question:2

This area chart shows total app usage hours aggregated across five age groups, from under 20 to 50+, using a synthetic dataset of 49 users with age and usage values. The visualization groups the data with `d3.group`, sums usage per group with `d3.sum`, and renders the result as a filled path using the `d3.area` generator. The SVG employs `d3.scaleBand` for the categorical x-axis, `d3.scaleLinear` for the y-axis, and both axes via `d3.axisBottom` and `d3.axisLeft`, with labels for age groups and usage hours.

Ssaivaishnogaruda@gmail.com
94% match
Loading thumbnail…

Activity7_Question2

This area chart shows average daily screen time in hours across different age groups, based on a CSV file loaded from a GitHub gist. The code uses D3 v7 to build the visualization, parsing the data with `d3.csv` and rendering the area path with `d3.area`. A point scale maps age categories horizontally, while a linear scale handles the vertical time axis, with axes generated using `d3.axisBottom` and `d3.axisLeft`. The SVG output includes labeled axes and a filled purple area with a dark stroke.

Eenochabraham97@gmail.com
85% match
Loading thumbnail…

Activity7_Qustn 2

This visualization displays average daily screen time across different age groups using an area chart. The chart encodes age groups along the x-axis with `d3.scalePoint` and average screen time hours on the y-axis with `d3.scaleLinear`. Data is loaded from a remote CSV file via `d3.csv`, and the area shape is generated with `d3.area` and rendered as an SVG path. Axes are created using `d3.axisBottom` and `d3.axisLeft`, with custom labels for both dimensions. The chart uses a green fill with a darker stroke and includes a title and border around the SVG canvas.

PPreethamreddyannavaram@my.unt.edu
82% match
Loading thumbnail…

Activity_quetion2

This visualization is a stacked horizontal bar chart that shows the average daily time, in minutes, that different age groups (Kids, Teens, Adults, Middle-aged, Seniors) spend on five activities: Screen Time, Physical Activity, Reading, Socializing, and Household Chores. The bars are segmented by activity and colored according to a categorical scale, with a tooltip revealing the exact minutes for each activity on hover. The chart is built with D3.js v7, using its `stack()` API to create the stacked segments and `scaleBand()` for the categorical y-axis. It renders to an SVG canvas and parses data from a local CSV file. The legend, axis labels, and styling are defined in an external CSS file.

Vvenkatdinesh5010@gmail.com
81% match
Loading thumbnail…

Activity 7 Question 1

This example displays a pie chart of user age distributions using six predefined age groups from a CSV dataset. Categories are counted from the `user_behavior_dataset.csv` file, and each slice animates with a fade-in transition via `d3.transition`. The visualization leverages `d3.pie`, `d3.arc`, and `d3.scaleOrdinal` with `d3.schemeCategory10` for coloring. A custom legend, built with HTML/CSS flexbox, accompanies the SVG chart to label each age group.

Hharshabandi3060@gmail.com
81% match
Loading thumbnail…

Activity7:Question:2

This area chart visualizes daily mobile usage hours over time, with the X-axis representing dates and the Y-axis showing usage duration. Peaks and dips in the chart reveal patterns in user behavior. The visualization uses Chart.js to render a line chart with filled area styling and PapaParse to parse CSV data fetched from a GitHub repository. The code sets smooth curve tension and a time-based X-axis scale.

Ssaivaishnogaruda@gmail.com
80% match
Loading thumbnail…

Activity6_Question2

This stacked bar chart shows the percentage of device usage (Mobile, Laptop, Tablet, TV) across five age groups, from 10-20 to 51+. The visualization uses D3 v7 with `d3.scaleOrdinal` for color encoding, `d3.scaleLinear` for the percentage x-axis, and `d3.scaleBand` for the age-group y-axis. Interactive tooltips appear on hover via the `mouseover`, `mousemove`, and `mouseout` events, displaying the exact percentage for each device segment. Data is loaded from a CSV file, and the chart is rendered as an SVG with a legend positioned to the right.

Mmohanalaharic@gmail.com
80% match
Loading thumbnail…

Fork of Activity6_task 2- Q1

This example shows smartphone usage percentages across five age groups as a horizontal stacked bar chart, with four activity categories (Social Media, Gaming, Productivity, Communication) distinguished by color. The visualization uses d3.stack() to compute layered series from CSV data, then binds rectangles to each layer using data joins. A d3.scaleBand positions age groups on the y-axis, while a d3.scaleLinear maps percentages to x-axis positions. The chart includes axes with percentage tick formatting and a custom SVG legend built from the same ordinal color scale, rendered entirely as SVG elements.

PPreethamreddyannavaram@my.unt.edu
80% match