Skip to main content
SimilarExport ZIP
100%

Fork of Activity6_Question 2

✓ Published0🌍 Public
Kkowshiksamudrala08@gmail.com
Last edited Apr 13, 2024
Created on Apr 13, 2024
Forked from Activity6_Task2

This stacked bar chart visualizes the distribution of performance ratings across six academic subjects, using data from a CSV file. Each bar is segmented into five percentage ranges, from below 60% to above 90%, with colors mapping to each category. Built with D3 v7, the visualization uses `d3.stack()` to create the stacked series, `d3.scaleBand()` and `d3.scaleLinear()` for axes, and an SVG renderer. Interactive tooltips display exact percentage values on mouseover, while a legend identifies the rating categories.

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…

Activity-6-Question-2

A stacked bar chart shows the percentage of student ratings across six subjects, with each bar segmented into five rating bands from "below 60%" to "above 90%". The chart uses `d3.stack()` to compute the layered data and `d3.scaleOrdinal()` for color encoding. Interactive tooltips appear on mouseover, displaying the exact percentage for each segment. The visualization is rendered as an SVG with axes created via `d3.axisLeft()` and `d3.axisBottom()`, reading data from a local CSV file.

Nnaveen.dodda4321@gmail.com
92% match
Loading thumbnail…

Activity6_Question2.3

This example presents a stacked horizontal bar chart that visualizes the distribution of grade percentage ranges (e.g., Below 60%, 60%-70%) across various academic subjects. Each bar is segmented by color-coded rating categories, with the width of each segment representing the proportion of ratings in that category. The visualization uses D3.js v7, employing `d3.stack()` for data restructuring, `d3.scaleBand()` for the categorical y-axis, and `d3.axisBottom()` for the continuous x-axis. Hovering over a segment reveals a tooltip with the exact percentage for that subject and rating band. Data comes from a CSV file.

Mmasters200128@gmail.com
90% match
Loading thumbnail…

Fork of Activity6_Question2

This stacked bar chart shows the percentage distribution of five rating levels within six product categories, visualizing how category influences ratings. Each bar segment represents a rating range, with hover interactions displaying exact percentages via tooltips. The visualization uses D3 v7 with a stacked layout, ordinal color scaling, and a band scale for categorical positioning. Data is loaded from a CSV file containing pre-calculated proportions, rendered as SVG rectangles with interactive mouse events.

Ssaibharath7thota@gmail.com
90% 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
90% match
Loading thumbnail…

Fork of Activity_6_Question_2

This stacked bar chart shows the percentage distribution of marks across five mark ranges for five students, with each bar segment representing a proportion that sums to 1. Designed with D3 v7, the visualization uses `d3.stack()` and `d3.scaleOrdinal()` for color encoding, while `d3.scaleBand()` positions students on the y-axis. Hovering over any segment triggers a tooltip displaying the exact percentage for that mark range, using the `mousemove` event and D3’s formatting helper. The SVG rendering applies custom axis labels and a manual legend, with data loaded from a CSV file.

AAbrarb702@gmail.com
90% match
Loading thumbnail…

Activity_6_Question_2

This stacked bar chart visualizes the distribution of rating categories within different subjects, showing how each subject’s marks are proportionally divided across five bins (e.g., below 35, 36-45, up to 75-100). It uses `d3.stack` to layer the rating proportions per subject on the y-axis, with a linear x-axis representing percentages. Interactive hover events display a tooltip for precise percentage values. The chart is rendered as SVG and relies on `d3.axisBottom` for the x-axis, `d3.axisLeft` for the y-axis, and a custom `d3.select`-based tooltip, with styling via CSS.

AAbrarb702@gmail.com
89% match
Loading thumbnail…

Fork of Activity6_Question2

This stacked bar chart shows the percentage distribution of movie ratings across five categories, with each bar segmented into five rating levels that sum to 100%. Categories appear on the y-axis and percentages on the x-axis, with hover interactions displaying precise percentage values via a tooltip. The visualization uses d3.scaleOrdinal for color encoding, d3.stack for data transformation, d3.axisBottom and d3.axisLeft for axes, and SVG rendering with event listeners for mouseover interactions.

Ssiddhartha gurram
89% match
Loading thumbnail…

Fork of Activity6_Question2

This stacked bar chart shows how movie ratings are distributed across six genres, with each bar representing the percentage of ratings in five categories from "below 5.0" to "above 8.5". The visualization uses d3.stack() to create stacked segments, d3.scaleBand for the genre categories, and d3.scaleOrdinal with a custom color palette. Hovering over any segment reveals a tooltip displaying the exact percentage for that genre and rating level. The data comes from a CSV file loaded and processed with D3 v7, rendered as SVG elements.

SSatish Nallamadugu
89% match