Activity-6-task-2

100%

Activity-6-task-2

✓ Published0🌍 Public

Last edited Apr 4, 2024

Created on Apr 4, 2024

This visualization displays the percentage distribution of IMDb movie ratings across five genres, using a horizontal stacked bar chart. Each bar represents a genre, with color-coded segments for rating ranges from "below 5.0" to "above 8.5". The code uses D3.js v7 APIs such as `d3.stack`, `d3.scaleOrdinal`, `d3.scaleBand`, and `d3.axisLeft` to process the CSV data and render the SVG. Interactive tooltips, implemented with `mouseover` events, show exact percentages on hover.

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_Task2

This visualization shows the distribution of IMDb movie ratings across different genres, using a stacked horizontal bar chart where each bar represents a genre and segments represent percentage ranges from "below 5.0" to "above 8.5". The chart uses a diverging color scheme with five distinct colors. Built with D3.js v7, the code employs `d3.stack()` with keys from the data columns, `d3.scaleBand()` for the y-axis, and `d3.scaleLinear()` for the x-axis percentage scale. Interactive tooltips display exact percentages on hover, while data is sourced from a CSV file containing genre-specific rating proportions.

Llokasaivenkatatammineedi@my.unt.edu

95% match

Loading thumbnail…

Activity6_Task2

This visualization shows the percentage distribution of IMDb movie ratings across five genres, broken into five rating categories. The stacked horizontal bar chart displays the proportion of each genre's movies that fall into rating brackets from below 5.0 to above 8.5, using a color scale to distinguish each rating segment. The code uses D3.js (d3.v7) to read CSV data, applies d3.stack() for the stacked layout, and uses d3.scaleLinear and d3.scaleBand for the x and y axes. Interactive tooltips appear on mouseover, showing the exact percentage for a specific genre and rating category, while the SVG rendering and custom CSS styles define the visual presentation.

Ssjannaikode@gmail.com

95% match

Loading thumbnail…

Activity6_Task2

This visualization shows the distribution of IMDb movie ratings across six genres, displayed as stacked horizontal bar charts. Each bar represents a genre, segmented into five rating categories from "below 5.0" to "above 8.5," with the x-axis measuring percentage. The code uses D3 v7’s `d3.stack`, `d3.scaleOrdinal`, `d3.scaleBand`, and `d3.scaleLinear` to position and color the segments. A tooltip appears on mouseover, displaying the exact percentage for each rating category. Data comes from a loaded CSV file, and the SVG rendering includes axis labels and a title.

Ssaiteja.cse.rymec@gmail.com

95% match

Loading thumbnail…

Activity6_Task2

This visualization displays a stacked horizontal bar chart showing the distribution of IMDb movie ratings across six genres, with each bar segment representing the percentage of movies falling into five rating ranges from below 5.0 to above 8.5. The data comes from a CSV file containing genre and rating proportion values. Built with D3.js v7, the visualization uses `d3.stack()` to compute stacked series and `d3.scaleOrdinal()` for color encoding, with mouseover tooltips revealing exact percentages. The SVG-rendered chart includes axis labels, a title, and interactive highlighting of individual segments.

VVidya Lakshmi Chitturi

95% match

Loading thumbnail…

Activity6_Task2

This visualization shows the distribution of IMDb movie ratings across seven genres, using a stacked horizontal bar chart where each bar segment represents the proportion of movies falling into five rating categories from "below 5.0" to "above 8.5." The chart uses D3 v7's `d3.stack()` and `d3.scaleOrdinal` with a custom color palette, rendering as SVG with axes from `d3.axisBottom` and `d3.axisLeft`. Interactive tooltips display exact percentages on mouseover, and the data comes from a CSV file with genre-proportion pairs.

SSrihith Reddy Gaddam

95% match

Loading thumbnail…

Activity6

This stacked bar chart shows the percentage distribution of IMDb ratings across six movie genres, with each bar divided into five rating categories from below 5.0 to above 8.5. The visualization uses D3.js v7 with an SVG rendering approach, employing `d3.stack` for the stacked bar construction, `d3.scaleOrdinal` for color encoding, and `d3.axisBottom`/`d3.axisLeft` for axes. Interactive hover states trigger tooltips that display precise percentages via `d3.format`. The underlying data is loaded from a CSV file containing genre-specific rating proportions.

Aanushapodapati99@gmail.com

95% match

Loading thumbnail…

Activity6_Task2

This visualization shows the distribution of IMDb movie ratings across six genres, using stacked horizontal bars to display the percentage of movies falling into five rating categories. The data comes from a CSV file and is rendered as SVG using D3.js v7. The code employs `d3.stack()` to create stacked series, `d3.scaleOrdinal` for color mapping, and `d3.scaleBand` with `d3.scaleLinear` for positioning. Interactive tooltips display exact percentages on hover, while axes and labels are generated using `d3.axisBottom` and `d3.axisLeft`.

Ssatvikreddy79@gmail.com

95% match

Loading thumbnail…

activity6 task_2

This visualization shows the distribution of IMDb ratings across six movie genres, using a stacked horizontal bar chart where each bar represents a genre and colored segments show the percentage of ratings in five score ranges. The chart is rendered as an SVG using D3 v7, with a tooltip that displays the exact percentage for each genre-rating segment on hover. The data comes from a CSV file containing proportional ratings for genres like Documentary, Drama, and Comedy. D3’s stack, scaleBand, and scaleOrdinal APIs handle the stacked layout and categorical coloring, while mouse events manage the interactive tooltip.

Bbrahmateja.edu2023@gmail.com

95% match