100%

Activity6_Task2

✓ Published0🌍 Public

Last edited Oct 22, 2024

Created on Oct 22, 2024

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.

AI-generated description

Fruit Consumption Visualization

This project visualizes fruit consumption across different taste categories using a stacked bar chart built with D3.js and ES6 modules.

Project Overview

The visualization represents five types of fruits (Apple, Banana, Orange, Mango, and Grapes) and their proportions across the following taste categories:

Sour
Bittersweet
Sweet
Very Sweet
Extremely Sweet

MIT Licensed

Similar vizzes

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

86% match

Loading thumbnail…

Activity 6 task 2 Q2

This stacked bar chart shows the percentage breakdown of fruit categories (Apples, Oranges, Bananas, Berries) across three months, using horizontal bars segmented by color. The visualization uses d3.stack() to compute cumulative values, d3.scaleOrdinal with d3.schemeCategory10 for color encoding, and d3.scaleBand for the categorical y-axis. Rendered as SVG, the chart positions each segment via d3.scaleLinear for the x-axis, with data loaded from an inline array. The tooltip behavior mentioned in the README is not implemented in the provided JavaScript code.

Mmounikakatipally995@gmail.com

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

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

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

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

84% match

Loading thumbnail…

Activity6_Task2- 3

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.

Nnissisharon61@gmail.com

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

83% match