Skip to main content
SimilarExport ZIP
100%

Activity Task 2

✓ Published0🌍 Public
Rrahulsiddhartha123@outlook.com
Last edited Apr 12, 2024
Created on Apr 12, 2024
Forked from Hello VizHub

This visualization displays the proportional ratings for different genres as horizontally stacked bars, using the classic Iris dataset. It maps the percentage composition of each genre across the data, with a legend indicating the rating categories. The code builds a stacked bar chart using `d3.stack()`, `d3.scaleBand()`, and `d3.scaleLinear()`, rendered as SVG. Interactive tooltips appear on mouseover, showing the exact percentage for each segment, and colors are assigned via `d3.scaleOrdinal()`.

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 Task 2

This visualization presents a stacked horizontal bar chart comparing the distribution of movie ratings by genre, using data from an IMDb dataset. Each bar segment represents a specific rating category, with the length of each segment corresponding to the proportion of ratings within that genre. The chart is rendered as an SVG using D3 v7, employing `d3.stack()` to create the stacked segments, `d3.scaleOrdinal()` for color assignment, and `d3.axisLeft`/`d3.axisBottom` for axes. Interactive tooltips appear on hover, displaying the exact percentage for each rating category.

BBamanGayathri
88% match
Loading thumbnail…

Activity 6 task 2

This stacked bar chart visualizes the percentage distribution of book ratings across five genres, using data from a CSV file. Each bar represents a genre, segmented by rating ranges from "below 4.0" to "above 8.5", with a horizontal axis showing percentages. The visualization uses D3 v7's `d3.stack`, `d3.scaleOrdinal`, `d3.scaleLinear`, and `d3.scaleBand` APIs, rendering as SVG in a browser. Interactive tooltips display precise rating percentages per genre when hovering over bar segments, with opacity changes on mouseover. The chart includes axis labels, a title, and a color-coded legend for rating ranges.

Jjaideeptripurani12@gmail.com
88% match
Loading thumbnail…

Activity6_Task2

This visualization shows the distribution of movie ratings across different genres using a stacked horizontal bar chart. Each bar represents a genre, segmented proportionally into five rating categories from below 5.0 to above 8.5, with a legend clarifying the color encoding. The code uses D3 v7’s `d3.stack()` to compute stacked series, `d3.scaleOrdinal` for category colors, and `d3.scaleBand` for genre positioning. Interactive tooltips appear on mouseover, displaying the percentage value. The chart is rendered as SVG, with data sourced from a CSV file containing genre-specific rating proportions.

FFayezuddin Mohammed Khan
87% match
Loading thumbnail…

Activity 6 Task2

This stacked bar chart shows the percentage distribution of rating levels within different movie genres, with each genre represented as a horizontal bar divided into colored segments. The visualization uses D3.js (v7) with an SVG rendering, applying `d3.scaleLinear`, `d3.scaleBand`, and `d3.stack` to process the data, while a custom tooltip displays exact percentages on hover. The color scale maps five distinct rating categories, and the chart includes axis labels and a legend to clarify the genre-to-rating relationship.

Vvishu.valandas@gmail.com
87% match
Loading thumbnail…

Activity 6 Task 2

This stacked bar chart shows the proportion of ratings across six movie genres, with each bar divided into five rating brackets from below 5.0 to above 8.5. The visualization reveals how genres like Documentary skew toward higher ratings while Action tends toward lower ones. Using d3.stack() and d3.scaleBand(), the chart encodes data from a CSV file as SVG rectangles. Interactive tooltips appear on mouseover, displaying the precise percentage for each rating segment using d3.format() and event handlers.

Jjaswanthreddy2000@gmail.com
87% match
Loading thumbnail…

Activity6_Task2

This visualization shows how IMDb movie ratings are distributed across genres as a stacked bar chart, with each bar representing the proportion of five rating ranges within a genre. Hovering over a segment reveals the exact percentage for that rating category. The chart uses a D3 v7 `d3.stack` layout with `d3.scaleOrdinal` colors and SVG rendering. Data is loaded from a CSV file, with axes formatted using `d3.axisBottom` and `d3.scaleBand`, and interactivity handled via mouse events with a custom tooltip.

UUday Vandanapu
87% match
Loading thumbnail…

Activity_6 task2

This example visualizes IMDb movie ratings by genre as a stacked horizontal bar chart, showing the proportion of titles falling into five rating brackets from below 5.0 to above 8.5. The chart uses d3.stack with d3.scaleOrdinal for color encoding and d3.scaleBand for the categorical genre axis, rendering SVG rectangles per segment. Interactive tooltips display exact percentages on hover using d3.select and mouse event handlers. Data comes from a CSV file with pre-aggregated genre-wise rating distributions.

HHarinathChakali33@gmail.com
87% match
Loading thumbnail…

Activity 6_Task 2

This visualization shows how movie ratings are distributed across six genres, using a stacked horizontal bar chart where each bar represents the percentage of films falling into five rating brackets from below 5.0 to above 8.5. Each genre’s bar is segmented into color-coded sections, with hover interactions revealing precise percentage values via tooltips. Built with D3 v7, the chart uses `d3.stack` for data transformation, `d3.scaleBand` for the genre axis, and `d3.scaleLinear` for the percentage scale. The data, loaded from a CSV file, is rendered as SVG, with axis labels and styling defined in external CSS.

Sskykarthik97@gmail.com
87% match