Question2_activity6

100%

Question2_activity6

✓ Published0🌍 Public

Last edited Oct 25, 2024

Created on Oct 25, 2024

This visualization shows the distribution of participation percentages across age brackets (Below 15, 15-20, 21-30, 31-40, Above 40) for six sports, using a stacked horizontal bar chart. Each sport’s bar is divided into segments colored by age group, with a legend on the right. Hovering over a segment reveals an interactive tooltip with the specific percentage. Built with D3 v7, the code uses `d3.csv`, `d3.stack`, `d3.scaleOrdinal`, `d3.scaleLinear`, `d3.scaleBand`, `d3.axisLeft`, and `d3.axisBottom`, rendering to an SVG canvas with data loaded from a local CSV file.

AI-generated description

An example showing the capabilities of VizHub:

Loads D3 via UNPKG.
Demonstrates use of import from "d3".
Demonstrates use of import from local ES6 modules.

MIT Licensed

Similar vizzes

Loading thumbnail…

Activity 6_Task-2_Question_2

This example visualizes the distribution of viewership ratings across five sports, using a horizontal stacked bar chart where each bar segment represents the proportion of viewers in a rating category (e.g., "Below 5.0", "5.0-6.5"). The chart, rendered with D3.js v7, employs a band scale for the y-axis and a linear scale for the x-axis. The code builds the stacked bars using `d3.stack` and `d3.scaleOrdinal` for color mapping, with interactive tooltips showing exact percentages on hover. Data is loaded from a static CSV file.

Rrajkodavati7@gmail.com

84% match

Loading thumbnail…

Activity 6_Question-3

This visualization displays a scatter plot comparing sports against the proportion of live streaming viewers above 50,000. It uses D3 v7 with an SVG rendering approach, loading sports data from a remote CSV file via d3.csv. The chart employs d3.scaleBand for the categorical x-axis and d3.scaleLinear for the y-axis, with colored circles representing each sport. Axis labels clarify the quantitative variable, while the code demonstrates d3.axisBottom and d3.axisLeft for tick generation.

Rrajkodavati7@gmail.com

84% match

Loading thumbnail…

Activity-6_Task-2_Ques2

This example shows a stacked horizontal bar chart of activity breakdowns by sport, displaying cardio, strength, and flexibility percentages for ten sports from a CSV file. It uses D3 v7 with SVG rendering, loading data via `d3.csv` and constructing the visualization with `d3.stack`, `d3.scaleLinear`, `d3.scaleBand`, and `d3.axisBottom`. The chart includes a legend, axis labels, and colored segments with numeric scaling from 0 to 100.

VVasanth Krishna

84% match

Loading thumbnail…

activity 6 task2

This stacked bar chart shows the distribution of ratings across six sports, with each bar segmented into five rating levels from “below 5.0” to “above 8.5.” The visualization uses D3.js v7 to create a horizontally stacked bar chart, where the x-axis represents the percentage (scaled from 0 to 1) and the y-axis lists the sports. Interactive tooltips display the exact percentage for each segment on mouseover, formatted to two decimal places. The chart uses `d3.scaleOrdinal` for color assignment, `d3.scaleLinear` for the x-axis, and `d3.scaleBand` for the y-axis, rendering with SVG and styled via CSS.

Iibrahimpatnamrohit1990@gmail.com

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

82% match

Loading thumbnail…

activity 6_Task 2

This visualization shows the distribution of star ratings (1 to 5) for different sports, displayed as a stacked horizontal bar chart where each bar represents a sport and segments show the proportion of each rating. The data comes from a CSV file with ratings for six sports, and the chart uses D3 v7 with SVG rendering. The code builds the stacked layout using `d3.stack()`, scales data with `d3.scaleLinear` and `d3.scaleBand`, colors segments via `d3.scaleOrdinal`, and includes interactive tooltips on mouseover that display the exact percentage for each rating segment.

Jjakeh311@yahoo.com

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

82% match

Loading thumbnail…

Activity 6 Question 2

This stacked bar chart shows movie genre preferences across five age groups, with each bar segment representing the percentage of respondents who rated a particular movie type. The visualization uses d3.stack() to compute cumulative values and d3.scaleOrdinal with a custom color palette to distinguish categories. Mouse interactions trigger tooltips that display exact percentages, while d3.axisBottom and d3.axisLeft render the axes with gridlines. The data originates from a CSV file, and the chart is rendered as SVG using D3 v7.

Ttallapanenisahithi@gmail.com

81% match