Activity6task2q2

100%

Activity6task2q2

✓ Published0🌍 Public

Last edited Apr 6, 2024

Created on Apr 6, 2024

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.

AI-generated description

This stacked bar chart gives the percentage of each Category level within different Category. The aim is to show the impact of Category on Sales performance. When the mouse hovers over each bar, you can see pop-ups of accurate percentage of each sales performance within each Category. Total percentage is 1, representing 100%.

MIT Licensed

Similar vizzes

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

89% match

Loading thumbnail…

Activity6_Task2_q2_3

This stacked bar chart displays the proportion of sales for five product categories across five rating ranges, from "less than 5" to "greater than 8.5". The visualization uses `d3.stack` to create stacked bars, with `d3.scaleBand` for the categorical y-axis and `d3.scaleLinear` for the numeric x-axis. Interactive tooltips appear on mouseover, showing the specific rating range and sales proportion. The chart reads data from a local CSV file and renders with SVG elements, animated transitions, and a legend using `d3.scaleOrdinal` for color assignment.

HHema Tummapala

88% match

Loading thumbnail…

Activity6_tak2.1

This stacked bar chart visualizes product sales across three categories, with each bar segment representing a product's sales contribution. The chart uses horizontal bars, with colors differentiating categories and a legend identifying each one. The visualization is rendered as an SVG using D3.js v7, employing the `d3.stack()` function to compose the stacked data structure, `d3.scaleLinear()` and `d3.scaleBand()` to set the scales, and `d3.scaleOrdinal()` for color encoding. Mouseover events log category sales amounts to the console, providing an interactive element.

KKritin Kesav

88% match

Loading thumbnail…

Activity_6_Question 2

This stacked horizontal bar chart shows the distribution of product costs across eight categories, with each bar divided into six price ranges from below $50 to above $1000. The visualization uses d3.stack() to compute the layered segments and d3.scaleBand for the categorical y-axis. d3.axisBottom with custom tick sizes renders the percentage scale, while a custom tooltip appears on mouseover to display exact percentage values. The chart is rendered as SVG using d3.v7, with color scaling via d3.scaleOrdinal and data loaded from a CSV file.

HHarsha vardhan reddy Yarmareddy

87% match

Loading thumbnail…

Activity6-Question2

This visualization shows quarterly sales data for product categories using a stacked horizontal bar chart. Each bar segment represents a quarter’s sales contribution, with an interactive tooltip displaying the specific category and sales amount on mouseover. The example demonstrates D3 v7’s `d3.stack` for data shaping, `d3.scaleBand` and `d3.scaleLinear` for axes, and `d3.axisLeft`/`d3.axisBottom` for rendering. Data comes from an inline CSV file loaded via `d3.csv`, and the chart is rendered as SVG with a custom legend.

SSaiKiranReddyKancharla@my.unt.edu

87% match

Loading thumbnail…

Activity_Task2

A stacked horizontal bar chart displays customer satisfaction ratings across six product categories, showing the proportional distribution of responses from "Very Unsatisfied" to "Very Satisfied" for each product. The visualization uses D3 v7 with SVG rendering, employing d3.stack() to compose the categorical segments and d3.scaleOrdinal with a custom color palette for the five rating levels. Bars are positioned along a d3.scaleBand y-axis, while percentages are mapped through a d3.scaleLinear x-axis. Interactive tooltips appear on mouseover, revealing the exact percentage for each rating category using d3.format().

Mmanishmanda@my.unt.edu

86% match

Loading thumbnail…

222

This stacked bar chart shows the percentage distribution of sales performance across five product categories, with each bar segmented into five sales ranges from "Below 100" to "Above 5000". Hovering over a segment reveals a tooltip with the exact percentage for that category and range. The visualization uses d3.stack() to create the stacked segments, d3.scaleBand() for the categorical y-axis, and d3.scaleLinear() for the percentage x-axis. Data comes from a CSV file with pre-calculated proportions summing to 1 for each category.

Nnumitha

86% match

Loading thumbnail…

activity_6 question2

This example presents a stacked horizontal bar chart that visualizes the distribution of low, moderate, and excellent product ratings as percentages, with each bar segment representing a rating category. The chart uses D3 v7's stack, scaleLinear, scaleBand, and axisBottom APIs to construct the visualization from a local CSV file. Interactive tooltips display the exact percentage of each rating when hovering over a segment, achieved through event listeners that calculate the value from the underlying data. SVG rendering handles the output, and the chart is enhanced with custom styling from an external stylesheet.

HHarinathChakali33@gmail.com

86% match