Activity6_Task2- 3

100%

Activity6_Task2- 3

✓ Published0🌍 Public

Last edited Mar 31, 2025

Created on Mar 31, 2025

This horizontal stacked bar chart visualizes the proportional distribution of fruit prices across five price ranges, from "Below 1.0" to "Above 4.0", using 100% stacked bars. The d3.stack() function with stackOffsetExpand normalizes each fruit's segments to a percentage scale, while d3.scaleOrdinal assigns distinct colors. The code uses D3 v7 APIs such as d3.axisBottom, d3.axisLeft, and the join operation for efficient element creation. Labels appear only where segments exceed 40 pixels in width, and a legend in the top-right corner maps colors to price ranges.

AI-generated description

Activity6 - 3

MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6_Task2

This horizontal stacked bar chart displays the percentage distribution of fruit prices across five ranges, from below 1.0 to above 4.0. Each bar is divided into color-coded segments representing price ranges, with white percentage labels shown for wider segments. The visualization uses D3.js v7 with a stacked bar layout, employing d3.stack and d3.stackOffsetExpand to normalize all bars to full width. The chart includes axes with percentage formatting, a legend for price ranges, and tooltips showing exact segment percentages.

Bbhavanasruthikakarlapudi@gmail.com

93% match

Loading thumbnail…

Activity6_Task2

This stacked bar chart visualizes the distribution of sales percentages across four regions for five fruit products, using data from a CSV file. Each horizontal bar is segmented by region, with colors corresponding to a categorical color scale, and the x-axis measures percentage from 0 to 1. The visualization uses `d3.axisBottom`, `d3.axisLeft`, and `d3.scaleOrdinal` to render the axes and color encoding. Hovering over a segment triggers a tooltip that displays the precise sales percentage for that fruit and region, calculated via `d3.format`. The chart is rendered as an SVG using D3 v7.

Aamarnadhkari98@gmail.com

86% match

Loading thumbnail…

Activity6_Question 3

This stacked bar chart visualizes the distribution of fruit ratings across six categories, from “below 4.0” to “above 8.0.” Each horizontal bar represents a fruit, with segments colored by rating category and proportional widths indicating percentages. Built with D3 v7, the example uses `d3.stack()` for data transformation, `d3.scaleBand` for the y-axis, and `d3.scaleLinear` for the x-axis. It loads CSV data from a local file, renders SVG, and adds interactive tooltips on mouseover, styled with CSS.

Kkartheekgrpt@gmail.com

85% match

Loading thumbnail…

Activity6_Task2_Qus3

This stacked bar chart displays the percentage of fruit sales across four regions: North, South, East, and West, with each bar representing a fruit type and colored segments showing regional proportions. Hovering over a segment reveals a tooltip with the exact percentage for that fruit-region combination. Built with D3 v7, the visualization uses `d3.stack()` to compute the stacked segments, `d3.scaleBand()` for the categorical y-axis, and `d3.scaleLinear()` for the percentage x-axis. The data comes from the embedded `sales.csv` file, and the SVG output includes a legend and axis labels.

Aamarnadhkari98@gmail.com

85% match

Loading thumbnail…

Activity6_Task2_Q2

This stacked bar chart visualizes fruit sales across multiple years, using horizontal segments to compare totals for Apple, Orange, Mango, and kiwi from 2018 to 2021. The chart displays the proportional contribution of each fruit per year, with tooltips showing exact sales values on hover. Built with D3 v7, the visualization uses `d3.stack()` and `d3.scaleOrdinal` for color encoding, along with `d3.axisLeft` and `d3.axisBottom` for axes. Data originates from an embedded CSV file, rendered as SVG elements.

PPothuguntla Pranitha

84% match

Loading thumbnail…

Activity-6_Question-2

This stacked bar chart displays the distribution of fruit ratings across five sweetness categories, from "below 5.0" to "above 8.5", with each fruit represented as a horizontal bar segmented by rating percentage. The visualization uses d3.stack() to compute cumulative values, d3.scaleBand() for the categorical y-axis, and d3.scaleLinear() for the percentage x-axis. Interactive tooltips reveal the exact percentage for each rating segment on mouseover, while an ordinal color scale assigns distinct hues to each category.

Ccharanshiva769@gmail.com

84% match

Loading thumbnail…

Activity6_Task2

This stacked bar chart shows the proportion of five taste categories—sour, bittersweet, sweet, very sweet, and extremely sweet—for five fruits: Apple, Banana, Orange, Mango, and Grapes. Each horizontal bar represents one fruit, segmented by taste category using a sequential color scale, with a legend on the right. Hovering over a segment displays a tooltip with the exact proportion value. The visualization is built with D3.js v7 using `d3.stack`, `scaleLinear`, and `scaleBand`, rendering as SVG, and loads data from a local CSV file.

Ssanjanaadapa7@gmail.com

83% match

Loading thumbnail…

Fork of Activity6_Task2

This stacked horizontal bar chart displays the proportion of six food categories (Fruit, Vegetables, Meat, Dairy, Grains, Snacks) across rating bands from "Below 4" to "Above 8." Each category is a row of stacked colored segments, where segment length represents the percentage of ratings in that band. The visualization uses d3.stack() to compute cumulative values and d3.scaleOrdinal() for categorical colors. It renders via SVG with d3.axisBottom and d3.axisLeft, and includes interactive tooltips on mouseover showing exact percentage values. Data comes from a CSV file with pre-computed proportions.

Sshivakumarganji@my.unt.edu

83% match