Task8_Tutorial2

100%

Task8_Tutorial2

✓ Published0🌍 Public

Last edited Apr 11, 2024

Created on Apr 11, 2024

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.

AI-generated description

MIT Licensed

Similar vizzes

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

93% match

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

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

86% match

Loading thumbnail…

activity 6_task_2

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.

Ssairohithchada@gmail.com

85% match

Loading thumbnail…

Task8_Tutorial 2_Q

This stacked bar chart visualizes the percentage of revenue across six product categories, with each bar segmented into five revenue ranges from "less than 100" to "above 5000." The data comes from a CSV file, and the visualization uses d3.stack() to compute the stacked segments, with a d3.scaleOrdinal providing color encoding for each revenue range. Hovering over any segment triggers a tooltip that displays the exact percentage for that category and revenue range. The chart employs d3.scaleLinear for the x-axis, d3.scaleBand for the y-axis categories, and SVG rect elements for rendering the bars.

SSushmaNamidi@my.unt.edu

81% match

Loading thumbnail…

Activity 6_Tutorial 2

This stacked horizontal bar chart displays the distribution of salaries across five departments, with each bar segmented by salary bracket proportions. Built with D3.js v7 and rendered as SVG, the visualization uses `d3.stack()` to compute cumulative values, `d3.scaleBand()` for the categorical y-axis, and `d3.scaleLinear()` for the percentage x-axis. Data from the CSV file is mapped to colored rectangles, with interactive mouseover tooltips revealing exact percentages per bracket.

Aa9.hemraj@gmail.com

81% match

Loading thumbnail…

Tutorial 8 Task 2

A stacked horizontal bar chart displays the percentage distribution of IMDb movie ratings across six genres, with each bar segmented into five rating brackets from “below 5.0” to “above 8.5.” The chart uses D3 v7’s `d3.stack()` to compute the stacked series and `d3.scaleOrdinal` for color mapping, rendering SVG rectangles via data joins. Axis labels and tick formatting are handled with `d3.axisBottom` and `d3.axisLeft`, while hover interactions show a custom tooltip with precise percentages. The data originates from a CSV file loaded and parsed by D3.

Jjaswanthichowdarykalapala@my.unt.edu

81% match

Loading thumbnail…

Activity6_Task2

This stacked bar chart shows the percentage of movie ratings across five genres, using horizontal bars segmented by rating categories from "below 5.0" to "above 8.5". Hovering over a segment reveals the exact percentage via a tooltip. The visualization uses d3.csv to load data, d3.stack for stacking, and d3.scaleBand and d3.scaleLinear for axes. SVG rendering displays the chart, with a legend and axis labels.

Kkrunalpatel@my.unt.edu

80% match