Skip to main content
SimilarExport ZIP
100%

Activity 6_Tutorial 2

✓ Published0🌍 Public
Aa9.hemraj@gmail.com
Last edited Oct 30, 2025
Created on Oct 30, 2025

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.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

activity 6 Task 2

This example shows the distribution of employee salaries across six departments, broken into five income brackets from "below 50k" to "above 85k." A stacked bar chart displays each department’s proportional share per bracket, with a tooltip revealing the exact percentage on hover. The code uses d3.stack() to aggregate the data from a CSV file and d3.scaleBand and d3.scaleLinear for axes, with d3.axisLeft and d3.axisBottom for ticks. Custom colors, a legend, and interactive opacity changes on mouse events enhance readability.

Aa9.hemraj@gmail.com
90% match
Loading thumbnail…

Question 2

This example presents a 100% stacked bar chart illustrating salary distribution across six departments. Each horizontal bar is segmented by five salary brackets, from “below 50k” to “above 85k,” with segment lengths proportional to the percentage of employees in that bracket. The visualization uses D3.js (v7) with an SVG rendering. It leverages the `d3.stack` API to compute stacked segments, `d3.scaleBand` for the y-axis (departments), and `d3.scaleLinear` for the x-axis (percentages). The code displays interactive tooltips on hover, showing the exact salary bracket and its percentage value, and includes a legend listing salary brackets.

MMohammed Abdul Mannan
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
81% match
Loading thumbnail…

bar

This stacked bar chart shows salary distributions across employment types, segmented by experience level. It uses d3.csv to load salary data, d3.stack() to aggregate the subgroups, and d3.scaleBand and d3.scaleLinear for the X and Y axes. Rendered as SVG with a two-color ordinal scale, the bars display stacked red and blue segments without a legend.

AArungopal Andalam
81% match
Loading thumbnail…

Activity 6

A stacked bar plot displays the distribution of three categories—Process, People, and Technology—across five company departments, with horizontal bars scaled by the number of employees. Hovering over a segment highlights it and shows a tooltip with the exact category and count. Built with D3 v7, the visualization uses `d3.stack`, `d3.scaleBand`, and `d3.scaleLinear` to position rectangles within an SVG, while an ordinal color scheme assigns distinct hues. Data is loaded from a local CSV file, and the chart includes labeled axes and a legend.

MMannava Priyanka Chowdary
80% 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
80% match
Loading thumbnail…

Activity6_question2

This stacked horizontal bar chart displays sales totals for five store locations, broken down by product categories including clothing, equipment, and accessories. The visualization uses d3.stack() to compute the segmented bar series and d3.scaleLinear and d3.scaleBand for positioning. Rendered as SVG with D3 v7, the chart includes interactive tooltips that display precise numeric values when hovering over each segment. Category colors are assigned via d3.scaleOrdinal, and axis labels and legends are manually added.

Ggnanendra097@gmail.com
80% match
Loading thumbnail…

Activity6task2q2

This stacked bar chart visualizes the percentage of sales performance within each product category, with horizontal bars segmented by price ranges from "Below 100" to "Above 5000." The chart uses D3 v7's `d3.stack()` to create the stacked segments, `d3.scaleLinear` and `d3.scaleBand` for positioning, and `d3.scaleOrdinal` for color mapping. Interactive tooltips display exact percentages on hover using mouse events, while SVG rendering provides the visual output.

Ssaitejakaranam10@gmail.com
80% match