Skip to main content
SimilarExport ZIP
100%

Fork of Activity_06_2

✓ Published0🌍 Public
Ssahaspragna6@gmail.com
Last edited Apr 11, 2024
Created on Apr 11, 2024
Forked from Activity_6_2

A stacked bar chart displays the percentage distribution of movie ratings across genres, with each bar segment representing a rating level and colors distinguishing them. The visualization uses d3.stack() to compute stacked series and d3.scaleOrdinal() for color mapping, rendering SVG rectangles via d3.selectAll(). Hovering triggers a tooltip showing the exact percentage for each rating segment. Data is loaded from a CSV file with rating percentages per genre, and the chart includes axes, labels, and a legend.

AI-generated description

The impact of genre on movie ratings

This stacked bar chart gives the percentage of each rating level within different movie genres. The aim is to show the impact of genre on movie ratings. When the mouse hovers over each bar, you can see pop-ups of accurate percentage of each rating level within each genre. Total percentage is 1, representing 100%.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Activity 6

This example visualizes the percentage distribution of movie ratings across six genres using a stacked bar chart rendered with SVG. The chart displays rating categories from below 5.0 to above 8.5 as colored segments, with each genre represented as a horizontal bar. The code loads data from a CSV file using `d3.csv` and constructs the visualization with `d3.scaleBand`, `d3.scaleOrdinal`, and `d3.stack`. Interactive tooltips appear on mouseover, showing the exact percentage for each segment. Colors are assigned using `d3.schemeCategory10`, and hover effects are implemented with CSS transitions.

Aanushapodapati99@gmail.com
93% match
Loading thumbnail…

Fork of Activity-6 Task2

This stacked bar chart illustrates the distribution of movie ratings across genres, revealing how genre impacts rating percentages. Hovering over a segment displays the exact percentage via a tooltip. Built with D3.js v7, the visualization computes stacked proportions from CSV data and renders the chart as SVG, using `d3.stack`, `d3.scaleBand`, and `d3.scaleOrdinal` for the color scale. The tooltip is a positioned HTML div.

Hharshaps15@gmail.com
93% 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
92% match
Loading thumbnail…

Activity_6_2

This visualization presents a stacked bar chart showing the percentage distribution of movie ratings (from "one" to "five") across different genres, with each bar segment colored to represent a rating category. Hovering over any segment displays a tooltip with the precise percentage for that rating within the genre, and the total for each bar sums to 100%. Built with D3 v7, the chart uses `d3.stack()` to compute the stacked segments, `d3.scaleOrdinal` for color mapping, and `d3.scaleBand` for genre positioning on the y-axis. Data is derived from the included CSV file, rendered as SVG elements with interactive mouse events.

Ssahaspragna6@gmail.com
92% match
Loading thumbnail…

Activity_6_2

This stacked bar chart visualizes the distribution of movie ratings across six genres, showing the percentage of ratings in five categories from "below 5.0" to "above 8.5". The chart uses `d3.stack()` and `d3.scaleOrdinal` for color encoding, with a linear x-axis for percentages and a band scale for genres. Hovering over a segment triggers `d3.select` and tooltip updates via `d3.mousemove`, displaying the exact percentage. The SVG is rendered with `d3.axisBottom` and `d3.axisLeft`, while data is loaded from a CSV file containing the genre and rating proportions.

Ssahaspragna6@gmail.com
92% match
Loading thumbnail…

Fork of Activity_6 Question2

This example visualizes the percentage of movie ratings by genre using a stacked horizontal bar chart. Each bar segment represents a genre, with colors mapping to categories like Comedy or Drama, and hover interactions reveal precise percentages. Built with D3 v7, the chart utilizes `d3.stack` to compose the data, `d3.scaleBand` and `d3.scaleLinear` for axes, and SVG rendering. The tooltip is implemented with a custom HTML div, while styling comes from a Google Fonts import.

Bbhavanadupati3@gmail.com
91% match
Loading thumbnail…

Fork of Activity-6 Question2

This stacked bar chart shows how movie ratings vary across genres, with each bar divided into rating categories and the total always equaling 100%. Hovering over a bar segment reveals a tooltip with the exact percentage for that rating within the selected genre. The visualization uses D3 v7’s `d3.stack`, `d3.scaleOrdinal`, `d3.scaleLinear`, and `d3.scaleBand` to generate SVG rects, with `d3.axisBottom` and `d3.axisLeft` for axes. A custom tooltip displays precise values, while the color palette distinguishes rating levels.

Ssaimanvith22@gmail.com
91% match
Loading thumbnail…

Fork of Activity6question2

A stacked horizontal bar chart shows the percentage distribution of IMDb ratings across six genres, using five rating brackets from below 5.0 to above 8.5. The code loads data from a CSV file and uses d3.stack, d3.scaleOrdinal, d3.scaleLinear, and d3.scaleBand to build the chart. Each segment displays a tooltip on mouseover that reports the exact percentage for that genre and rating bracket. The visualization uses SVG rendering with D3 v7.

Vvaishnavi6gan@gmail.com
91% match