Skip to main content
SimilarExport ZIP
100%

Fork of Activity-6 Question-2

✓ Published0🌍 Public
Ssusarlasruthi2000@gmail.com
Last edited Apr 5, 2024
Created on Apr 5, 2024

This example visualizes restaurant cuisine ratings across different percentage brackets using a stacked horizontal bar chart. It shows the distribution of ratings from below 4.0 to above 8.0 for six cuisines, with each bar segment colored by rating category. The visualization uses d3.stack to create the stacked data, d3.scaleBand for the y-axis cuisine categories, and d3.scaleLinear for percentage values. Interactive tooltips display specific rating percentages on hover, while axes are rendered using d3.axisBottom and d3.axisLeft with custom tick styling.

AI-generated description

An example showing the capabilities of VizHub:

  • Loads D3 via UNPKG.
  • Demonstrates use of import from "d3".
  • Demonstrates use of import from local ES6 modules.
MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Activity-6 Question-2

This example presents a horizontal stacked bar chart showing the percentage distribution of vegetable ratings across six categories, from "below 4.0" to "above 8.0." The chart uses D3 v7’s `d3.stack()` and `d3.scaleBand()` to construct the layered bars, with `d3.scaleOrdinal()` assigning colors. Mouseover events trigger a custom tooltip displaying the exact percentage for each segment. Data loads from a local CSV file, and the visualization renders as SVG with axes labeled by vegetable type and percentage.

Ssusarlasruthi2000@gmail.com
90% match
Loading thumbnail…

Activity6_Question2

This stacked horizontal bar chart shows the distribution of ratings for six food categories, from "Below 4" to "Above 8," with each bar segment representing the percentage of ratings in that range. Built with D3 v7, the visualization uses `d3.stack()` to compute the stacked segments, `d3.scaleLinear()` for the x-axis, and `d3.scaleBand()` for the y-axis categories. Hovering over a segment highlights it and displays a tooltip with the exact percentage, while the data is loaded from a local CSV file. The SVG rendering includes custom axis labels and a legend.

PPadmajaKodati@my.unt.edu
87% match
Loading thumbnail…

Fork of Fork of Activity6_Task2

This horizontal stacked bar chart shows the proportion of ratings (from "Below 4" to "Above 8") for six food categories (Fruit, Vegetables, etc.), with each bar’s segments representing the percentage of ratings in that range. The chart uses `d3.stack()` to create the stacked segments, `d3.scaleBand` for the categorical y-axis, and `d3.scaleLinear` for the x-axis. Hovering over a segment reveals a tooltip showing the exact percentage for that rating, calculated from the provided data. The visualization is rendered as SVG using D3 v7, with colors assigned via `d3.scaleOrdinal`.

Sshivakumarganji@my.unt.edu
87% match
Loading thumbnail…

Fork of task 8 question 2.2

This visualization displays the proportion of ratings (from "Below 4" to "Above 8") for six food categories using stacked horizontal bars. The chart uses D3 v7 to process the CSV data with d3.stack(), maps categories to the y-axis via d3.scaleBand(), and encodes proportions on the x-axis with d3.scaleLinear(). Interactive tooltips, styled with CSS, reveal exact percentages on mouseover. The SVG rendering includes a legend and custom color palette from a d3.scaleOrdinal() scale.

Vvchittimadha@gmail.com
87% match
Loading thumbnail…

Activity 6 quiz 2.1

This stacked bar chart visualizes the distribution of food ratings across twenty cuisines, with each bar segment representing the proportion of responses in five categories from "Extremely Low" to "Highest." The visualization uses d3.stack() to transform the CSV data into stacked series, d3.scaleOrdinal for color encoding, and d3.scaleBand for the categorical y-axis. Interactive tooltips appear on mouseover, displaying the exact percentage for each rating category using d3.format. The SVG rendering includes custom axes, gridlines, and a legend-style title.

Ssreejabommineni1506@gmail.com
86% match
Loading thumbnail…

Activity6_Question2

This stacked bar chart shows the percentage distribution of five rating levels across seven restaurants, using horizontally oriented bars where each segment represents a rating category. The visualization employs d3.stack() to compute stacked series from CSV data, d3.scaleBand() for the categorical y-axis, and d3.scaleLinear() for the percentage x-axis. Color encoding via d3.scaleOrdinal distinguishes rating bins, while mouseover events trigger tooltip displays showing exact percentage values. The SVG rendering includes axis labels, a title, and grid lines, with data sourced from dataQ2.csv.

Rrishithagovini99@gmail.com
86% match
Loading thumbnail…

Fork of Activity6_Ques2(3)

A stacked bar chart displays the percentage of ratings across five categories (Technology, Finance, Healthcare, Education, Sports, and Entertainment) for rating ranges from below 18 to above 9. Each category is represented as a horizontal bar divided into colored segments, with colors mapped via d3.scaleOrdinal. The chart uses d3.stack to compute stacked data and d3.scaleBand with d3.scaleLinear for positioning. Interactive tooltips appear on mouseover, showing the exact percentage for each rating segment using d3.format. The visualization renders with SVG and uses D3 v7.

Nnithinnc@outlook.com
86% match
Loading thumbnail…

Activity 6 Question 2

This stacked bar chart shows the percentage distribution of six rating categories within each of six food categories, revealing how genre influences rating outcomes. Mouse hover actions highlight individual bar segments and display exact percentages via tooltip pop-ups. The visualization uses d3.stack() to generate stacked series, d3.scaleOrdinal() for color mapping, d3.scaleLinear() and d3.scaleBand() for axes, and d3.axisBottom() for the percentage axis, rendering in SVG with data from a CSV file.

Jjaswanthreddy2000@gmail.com
85% match