Skip to main content
SimilarExport ZIP
100%

activity 6_task_2

✓ Published0🌍 Public
Ssairohithchada@gmail.com
Last edited Apr 1, 2025
Created on Apr 1, 2025
Forked from Hello VizHub

This stacked bar chart shows the daily time allocation for five life stages—children, adolescents, young adults, middle-aged, and elderly—across categories such as sleep, work/study, entertainment, outdoor activities, and meditation. Each bar segment represents a category’s duration in minutes, with a tooltip revealing exact values on hover. Built with D3 v7, the visualization uses d3.stack() to aggregate the data, d3.scaleBand() for the y-axis, and d3.scaleLinear() for the x-axis, rendering SVG rectangles. Styling leverages CSS for typography and axis formatting, with a custom tooltip div for interactivity.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Task2

A stacked horizontal bar chart, titled "Time Spent on Daily Activities," visualizes the proportional distribution of time across five categories for ten daily activities. Each bar represents an activity, with colored segments showing the percentage of time spent in categories like "less than 1 hour" to "more than 6 hours". The visualization uses D3 v7 with an SVG rendering approach, employing `d3.stack()` to generate the stacked data and `d3.scaleOrdinal` for color mapping. Interactive tooltips display exact percentages on hover, built with D3 event handlers and HTML div elements.

Aamanipeddolla@my.unt.edu
88% 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
86% match
Loading thumbnail…

Task8_tutorial2

This visualization displays the daily hours spent by five people across five activity categories—work, exercise, socializing, chores, and leisure—as a stacked horizontal bar chart. The chart uses a linear x-axis for hours (0–24) and a categorical y-axis for each person, with interactive tooltips showing percentage values on hover. The example employs D3 v7’s `d3.stack` for data stacking, `d3.scaleBand` for the categorical axis, `d3.scaleOrdinal` for category colors, and SVG rendering with custom CSS for styling.

Ppogirimayoor@gmail.com
85% match
Loading thumbnail…

Task8_Tutorial2

A stacked bar chart displays the daily time allocation for five people across categories like work, exercise, and leisure, with each bar segmented by activity and scaled from 0 to 24 hours. The chart uses D3 v7’s `d3.stack` to compute the stacked series, `d3.scaleOrdinal` for color encoding, and `d3.axisBottom` and `d3.axisLeft` for axes. SVG rectangles render the segments, with mouseover effects and a tooltip, while the data comes from an inline CSV file with genres as rows and activities as columns.

Ppogirimayoor@gmail.com
85% match
Loading thumbnail…

Task8_Question2

A stacked bar chart displays the hours seven people spend across six hobbies—Outdoors, Indoors, Reading, Shopping, Fitness, and Travel—using a diverging color palette. The horizontal bars encode total hours per person, segmented by hobby, with a tooltip revealing exact values on hover. The visualization is rendered with D3 v7, using `d3.stack`, `d3.scaleBand`, and `d3.scaleLinear` to construct the chart, while `.on('mouseover')` events manage a custom tooltip. Data is loaded from a CSV file, and the SVG output is styled with custom fonts and a soft background.

Jjyothirmaijyothi2017@gmail.com
82% match
Loading thumbnail…

Activity6_Task2

This stacked horizontal bar chart visualizes the distribution of age groups across different continents, with each bar representing a continent and segments colored by age bracket. The visualization uses a D3.js v7 SVG rendering with `d3.stack()` to compute the stacked segments, `d3.scaleOrdinal()` for color mapping, and `d3.scaleBand()`/`d3.scaleLinear()` for axes. Tooltips, implemented via mouseover events, display the exact percentage for each segment, with x-axis labels indicating percentage values. Data is loaded from a CSV file containing pre-calculated proportions per continent.

Pperamranji
81% match
Loading thumbnail…

actvity6-2

A stacked horizontal bar chart shows the percentage of population in three age brackets—14 years and below, 15 to 64 years, and 65 years and above—across seven global regions. The SVG is built with D3 v7, using `d3.stack()` to compute the stacked segments, `d3.scaleLinear()` and `d3.scaleBand()` for positioning, and `d3.scaleOrdinal()` to assign categorical colors. Interactive tooltips reveal exact percentages on hover. Data comes from a CSV file, with axes labeled and a title displayed above the chart.

BBibek Lamsal
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