Activity8_Task2

100%

Activity8_Task2

✓ Published0🌍 Public

Last edited Apr 8, 2024

Created on Apr 8, 2024

This example visualizes the distribution of IMDb movie ratings across six genres, using stacked horizontal bars to show the percentage of films falling into five rating categories from below 5.0 to above 8.5. The chart includes a color legend and interactive tooltips that display the exact percentage for each segment on hover, with bars dimming during mouseover. Built with D3 v7, it loads data from a local CSV file, uses `d3.stack()` to compute the stacked series, and renders as SVG with `d3.scaleOrdinal` for colors and `d3.scaleBand` for the categorical axis.

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 example visualizes the distribution of IMDb movie ratings across six genres, using stacked horizontal bars to show the percentage of movies in five rating bins from "below 5.0" to "above 8.5." The chart employs D3 v7’s `d3.stack`, `d3.scaleOrdinal` with a categorical color palette, and `d3.scaleBand` for the genre axis. Interactive tooltips appear on mouseover, displaying the exact percentage for each genre-rating segment. Data is loaded from a local CSV file and rendered as SVG.

Ggroup118sai@gmail.com

97% match

Loading thumbnail…

Activity_6_task_2

This example visualizes the distribution of IMDb movie ratings across six genres using a stacked horizontal bar chart. It shows the percentage of movies falling into five rating brackets, from below 5.0 to above 8.5, with each genre represented as a distinct bar. The chart is built with D3 v7, using d3.stack() to compute the stacked segments, d3.scaleOrdinal() for color encoding, and d3.scaleBand() for the categorical y-axis. Interactive tooltips reveal exact percentages on mouseover, using d3.select() and element event handlers. The data comes from a CSV file containing genre and rating proportion values.

Lleelakrishnadivi7@gmail.com

96% match

Loading thumbnail…

Activity6_Task2

This example visualizes the distribution of IMDb movie ratings across six genres using a stacked horizontal bar chart. Each bar segment represents the percentage of movies within a rating interval, from “below 5.0” to “above 8.5”. The chart, rendered as SVG, uses D3 v7’s `d3.stack`, `scaleOrdinal`, `scaleLinear`, and `scaleBand`. Hovering over a segment highlights it and displays a tooltip with the exact percentage, computed via `d3.format`. Data originates from a local CSV file.

Aalapati98@gmail.com

96% match

Loading thumbnail…

Activity6_Task2

This example visualizes the distribution of IMDb movie ratings across six genres using a stacked horizontal bar chart. Each bar segment represents the percentage of movies within a rating range (e.g., below 5.0, 5.0–6.5), with a legend on the right. Built with D3 v7, it uses `d3.stack`, `d3.scaleOrdinal`, `d3.scaleBand`, and `d3.scaleLinear` to structure the data, while mouse events and a custom tooltip display exact percentages on hover. The chart is rendered as SVG with a CSV data source.

Ppnamitha46@gmail.com

96% match

Loading thumbnail…

Activity 6_Task2

This example visualizes the distribution of IMDb movie ratings across six genres, using stacked horizontal bars to show the proportion of movies in five rating brackets from "below 5.0" to "above 8.5." The chart is rendered as an SVG using D3 v7, with a diverging color scale distinguishing each rating category. The code employs `d3.stack()` to compute stacked bar segments, `d3.scaleBand()` for the genre axis, and `d3.scaleLinear()` for the percentage axis, with interactive tooltips that appear on hover to display the exact percentage for each rating segment. The data comes from the included `data.csv` file, and the visualization uses a clean, readable layout with custom fonts and styled axes.

SSiva Kishore Reddy

96% match

Loading thumbnail…

Activity6_Task2

This example visualizes the distribution of IMDb movie ratings across six genres using a horizontal stacked bar chart. Each bar segment represents the proportion of ratings within a specific range (below 5.0, 5.0-6.5, 6.5-7.5, 7.5-8.5, above 8.5), with a sequential color scale distinguishing the categories. The chart is rendered as SVG using D3 v7, employing `d3.map`, `d3.stack`, `d3.scaleOrdinal`, and `d3.scaleBand` to construct the layout. Interactive tooltips display the exact percentage for each segment on hover, implemented via mouse event listeners.

HHari Kiran

96% match

Loading thumbnail…

Activity6_Task2

This stacked horizontal bar chart shows the distribution of IMDb movie ratings across six genres, with each bar divided into five rating categories from “below 5.0” to “above 8.5.” The visualization uses d3.stack() to compute the stacked segments and d3.scaleOrdinal() with a categorical color scale to distinguish rating bands. The code renders SVG rectangles via data joins and includes an interactive tooltip triggered by mouseover events, displaying the exact percentage for each genre-rating combination. Data comes from a CSV file containing precomputed proportions for each genre.

GGunna,Praneeth Reddy

96% match

Loading thumbnail…

Activity6_Task2

This example visualizes IMDb movie rating distributions across six genres using a stacked horizontal bar chart. Each bar represents a genre, segmented into five rating categories from "below 5.0" to "above 8.5," with segment widths proportional to the percentage of movies in that category. The code loads data from a local CSV file and uses D3 v7 APIs including `d3.stack`, `d3.scaleOrdinal`, `d3.scaleBand`, and `d3.scaleLinear` to construct the chart. Interactive tooltips appear on mouseover, displaying the exact percentage for each rating segment, with opacity changes highlighting the hovered bar portion.

Hhemalathayella@my.unt.edu

96% match