Skip to main content
SimilarExport ZIP
100%

Activity6_Question2

✓ Published0🌍 Public
AAreeba Hassan
Last edited Oct 22, 2024
Created on Oct 22, 2024
Forked from Hello VizHub

This stacked bar chart visualizes how students across six academic domains perceive AI, showing the percentage distribution across five GPA ranges. The chart uses D3 v7 to load CSV data and render SVG elements, employing `d3.stack()` to generate stacked series and `scaleOrdinal` for color encoding. Interactive tooltips display domain, GPA range, and exact percentage on hover, while axis labels and a legend clarify the categorical breakdown.

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…

Activity6_Question2

This example shows a stacked bar chart comparing ratings across six AI-related categories, with each bar divided into five percentage-based rating brackets (below 5.0 through above 8.5). The visualization uses D3 v7 to load the CSV data, apply `d3.stack()` to compute the stacked segments, and render them as SVG rectangles scaled with `d3.scaleLinear` and `d3.scaleBand`. Hover interactions trigger a tooltip displaying the exact percentage for each segment, and colors are assigned via `d3.scaleOrdinal`.

CChandra Prakash Reddy Kalwakolu
84% match
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
83% match
Loading thumbnail…

Fork of Activity6_Question 2

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.

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

Activity 6_Question 2

This stacked bar chart shows the percentage distribution of student grades across five rating intervals for different genres, revealing how grade categories vary by genre. The visualization uses D3 v7's stack, scaleLinear, scaleBand, and axis methods to construct the horizontal bars, with SVG rendering. Hovering over a segment triggers a custom tooltip displaying the exact percentage via a mouseover event handler. The data comes from a CSV file containing grade percentages per genre, with total proportions summing to 1. A color scale maps rating intervals to distinct hues.

Aanusha.chilkamarri26@gmail.com
82% match
Loading thumbnail…

Activity 6_Question2

This stacked bar chart shows the proportion of students enrolled in five different programs—Engineering, Computer Science, Business, Liberal Arts, and Health Sciences—across five universities, with each bar segmented by program and colored via a categorical scale. The visualization uses D3 v7’s `d3.stack()` to compute the stacked segments, `d3.scaleBand()` for the university categories, and `d3.scaleLinear()` for the percentage axis. Hovering over a segment triggers a tooltip displaying the exact percentage for that program at that university, using D3 event handlers. Data comes from an embedded `data.csv` file, rendered as SVG with custom styles from `styles.css`.

Ssiddhubhupathi@gmail.com
82% match
Loading thumbnail…

Activity6Question2

This example shows the distribution of ratings across five categories—AI Research, Machine Learning Development, and others—using a stacked horizontal bar chart. Each bar segment represents the percentage of ratings within a rating band, such as "below 5.0" or "7.5-8.5". The visualization uses d3.stack() to structure the data and d3.scaleOrdinal for color mapping. Mouse interactions trigger tooltips that display exact percentages, while d3.axisBottom and d3.axisLeft label the chart. Data is loaded from a CSV file with d3.v7.

Aalapati98@gmail.com
82% match
Loading thumbnail…

Activity6_q2

A stacked bar chart displays student enrollment across five engineering departments, with each bar segmented into Undergraduate, Postgraduate, and PhD counts. The visualization uses d3.csv to load the dataset, d3.stack() to compute stacked series, and d3.scaleBand/d3.scaleLinear for axes. Color encoding distinguishes academic levels via d3.scaleOrdinal, while SVG rectangles render the bars. The chart includes labeled axes for Department and Number of Students.

Vvidyagangasani@my.unt.edu
81% match