Activity6Task-2

100%

Activity6Task-2

✓ Published0🌍 Public

Last edited Apr 9, 2024

Created on Apr 9, 2024

This stacked bar chart visualizes the changing composition of categories A through D across the years 1995-2003. A radio button toggle transitions the rendering between a full stacked bar layout and a narrow, offset view that reveals individual category values. Built with D3 v4, the visualization uses `d3.scaleBand`, `d3.scaleLinear`, and `d3.stack` to process the CSV data, while SVG `rect` elements are animated via `transition` and `attr` calls. The color scale `d3.scaleOrdinal` distinguishes the four categories.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Activity 6 Question 2

This interactive stacked bar chart displays annual values for four categories from 1995 to 2003, loaded from a CSV file. Radio buttons toggle between two animated transitions: the first highlights bars with a green stroke, while the second narrows each bar and shifts it horizontally with a red stroke. The visualization uses D3 v4’s `d3.stack`, `d3.scaleBand`, `d3.scaleLinear`, and `d3.scaleOrdinal`, rendering shapes as SVG rectangles with `transition()` calls animating x, y, width, and stroke attributes.

Mmangilipallylaxminarayana@gmail.com

89% match

Loading thumbnail…

Activity6_Task2_Question2

This interactive stacked bar chart visualizes the distribution of five fruit types across five quantity bins, from "Below 100" to "Above 400." A radio-button interface toggles between two animation states: step one displays the full stacked bars, while step two separates each category into thinner, individual segments. Built with D3 v4, the visualization uses `d3.scaleBand`, `d3.scaleLinear`, `d3.stack`, and `d3.scaleOrdinal` to map data from a CSV file. The SVG rendering and smooth `.transition()` animations bring the data comparisons to life.

SShasankreddyganta@my.unt.edu

85% match

Loading thumbnail…

Activity6_Task2_Question_2

A stacked bar chart displays monthly sales totals for Electronics, Clothing, and Groceries across six months. Each bar segment represents a category’s contribution, with tooltips revealing exact values on hover and a color-coded legend identifying series. Using D3 v7, the visualization loads CSV data via `d3.csv`, constructs stacked series with `d3.stack()`, and renders SVG rectangles scaled by `d3.scaleBand` and `d3.scaleLinear`. Interactive tooltips appear through mouse events, while axes and legend are generated with `d3.axisBottom`, `d3.axisLeft`, and `d3.scaleOrdinal`.

Aadityatrip9899@gmail.com

81% match

Loading thumbnail…

Activity-8 Q2.3

This visualization is a stacked horizontal bar chart that displays hypothetical categories (A–E) and the percentage distribution across five rating brackets (below 10, 10-20, 20-30, 30-40, above 40). It shows how each category’s total percentage (summing to 1) is divided among the brackets using a diverging color scheme. The chart is built with D3 v7, using `d3.stack()` to compute stacked values, `d3.scaleLinear()` for the x-axis, and `d3.scaleBand()` for the categorical y-axis. Hovering over a segment reveals a tooltip with the exact percentage, implemented via D3’s selection and event handling. The SVG rendering uses a 960×500 canvas with margins and axis labels styled by the included stylesheet.

SSree Yuktha Sunkara

81% match

Loading thumbnail…

activity6_task2

A stacked horizontal bar chart displays customer satisfaction ratings across five product categories, with segments representing the percentage of responses in each rating level from "Excellent" to "Very Poor." The visualization uses D3 v7 with SVG rendering, employing `d3.stack()` to compute stacked series, `d3.scaleLinear` for the x-axis, `d3.scaleBand` for product categories, and `d3.scaleOrdinal` for color mapping. Interactive tooltips appear on mouseover, showing the exact percentage for each rating segment. Data comes from a local CSV file loaded asynchronously.

TThai Ha Dang

80% 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…

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

80% match

Loading thumbnail…

Activity6_questions 3 45

This stacked bar chart displays product sales across four categories (A through D), using horizontal bars segmented by category to compare total sales. The visualization uses D3.v7 with an SVG canvas, applying `d3.stack()` to compose the bar segments, `d3.scaleBand` for the product axis, and `d3.scaleLinear` for the sales axis. Hovering over a segment logs the specific category and sales value to the console, while a categorical color scale distinguishes the categories. The data comes from a local CSV file, and the chart includes axis labels and a legend.

Ppavanpkkalyan3@gmail.com

80% match