Skip to main content
SimilarExport ZIP
100%

activity6 task_2

✓ Published0🌍 Public
Bbrahmateja.edu2023@gmail.com
Last edited Apr 10, 2024
Created on Apr 10, 2024
Forked from Hello VizHub

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.

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 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
96% match
Loading thumbnail…

activity6_task 2

This stacked bar chart illustrates the percentage distribution of IMDb movie ratings across six genres, with each genre’s bars broken into five rating categories from “below 5.0” to “above 8.5.” The visualization uses a horizontal layout, with genres on the y-axis and the percentage scale on the x-axis, totaling 1. Hovering over any segment reveals a tooltip with the precise percentage for that rating category within the genre. The chart is rendered as SVG using D3 v7, leveraging `d3.stack`, `d3.scaleOrdinal`, and `d3.axisLeft`/`d3.axisBottom` to build the stacked bars and axes, with data loaded from a CSV file.

Sshivasaiamaravadi@gmail.com
96% match
Loading thumbnail…

Activity6_Task2

This visualization shows the distribution of IMDb movie ratings across six genres, with each genre displayed as a horizontal stacked bar chart broken into five rating categories from "below 5.0" to "above 8.5". The percentages reveal how genres like Documentary skew toward higher ratings, while Action films cluster in the lower ranges. Using D3 v7 with SVG rendering, the code builds the stacked layout via `d3.stack()`, scales positions with `d3.scaleLinear` and `d3.scaleBand`, applies a custom ordinal color scale, and implements interactive tooltips on mouseover to display exact percentage values for each rating segment.

Nnikhilthoutu24@gmail.com
96% match
Loading thumbnail…

activity6task2

This stacked bar chart shows how IMDb movie ratings are distributed across six genres, with each bar divided into five rating categories from below 5.0 to above 8.5. Hovering over a segment reveals its exact percentage in a tooltip. The visualization uses d3.stack() to create the stacked layout, d3.scaleOrdinal for colors, and d3.scaleBand for the genre axis, rendering as SVG with data loaded from a local CSV file.

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

Activity6_task2

This chart visualizes the distribution of IMDb ratings across six movie genres, showing the proportional share of films within each rating category from "below 5.0" to "above 8.5" as stacked horizontal bars. The code uses d3.v7 with SVG rendering and d3.stack() to generate the stacked layout, d3.scaleBand() for the genre axis, and d3.scaleLinear() for the percentage scale. Interactive tooltips display exact percentages on mouseover, while the data is loaded from a CSV file containing aggregated genre-rating proportions.

Vvishnupriyapalagiri@gmail.com
95% match
Loading thumbnail…

Activity6Task2

This example visualizes the distribution of IMDb ratings across different movie genres using a stacked horizontal bar chart. Each bar segment represents the percentage of movies within a specific rating bracket (below 5.0, 5.0-6.5, 6.5-7.5, 7.5-8.5, above 8.5) for genres like Documentary, Drama, Comedy, Romance, Animation, and Action. The visualization is rendered as SVG using D3 v7, with data loaded from a CSV file. It uses `d3.stack()` for stacked bars, `d3.scaleLinear()` and `d3.scaleBand()` for axes, and `d3.axisBottom()` for the x-axis. Hovering over a segment displays a tooltip showing the exact rating percentage for that genre and bracket.

Ssatishvelaga02@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