Skip to main content
SimilarExport ZIP
100%

Fork of Activity 6 Task 2

✓ Published1🌍 Public
Ttallapanenisahithi@gmail.com
Last edited Oct 22, 2024
Created on Oct 22, 2024

This example visualizes IMDb movie ratings across six genres with a stacked horizontal bar chart. Each bar represents a genre, segmented by rating categories from "below 5.0" to "above 8.5," showing the proportion of films in each rating band. The visualization uses D3 v7 with d3.stack, d3.scaleBand, and d3.scaleLinear to construct the chart, and includes interactive tooltips that display exact percentages on mouseover. The SVG rendering loads data from a local CSV file and applies a custom color scale for the rating categories.

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…

Fork of Activity 6_Task 2

This stacked bar chart displays the percentage distribution of IMDb rating categories across five movie genres, showing how genre influences audience ratings. The visualization uses color-coded segments for each rating bracket, with tooltips revealing precise percentages on hover. Built with D3.js v7, the chart employs d3.stack to generate stacked data, d3.scaleLinear and d3.scaleBand for axes, and d3.scaleOrdinal for color mapping. SVG rendering handles the interactive elements, with data sourced from a local CSV file.

Ttallavijayalakshmi0710@gmail.com
95% match
Loading thumbnail…

Fork of Activity6_Task2

A stacked horizontal 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 reads data from a CSV file and renders it using D3 v7's `d3.stack`, `d3.scaleLinear`, `d3.scaleBand`, and `d3.scaleOrdinal` APIs. Interactive tooltips appear on mouseover, displaying the exact percentage for each genre-rating segment using `d3.format`. SVG is the rendering approach, with axes and labels styled through external CSS.

Hharshabandi3060@gmail.com
95% match
Loading thumbnail…

Fork of Activity6_Task2

This stacked bar chart visualizes the distribution of IMDb ratings across six movie genres, showing the percentage of titles falling into five rating brackets from “below 5.0” to “above 8.5.” The data is loaded from a CSV file and rendered as horizontal bars using D3.js v7’s `d3.stack`, `d3.scaleBand`, and `d3.scaleOrdinal` APIs. Each genre row is segmented by rating category, with interactive tooltips displaying exact percentages on mouseover. The SVG output includes labeled axes and a color legend, processed entirely through D3’s data-join pattern.

Kkowshiksamudrala08@gmail.com
95% match
Loading thumbnail…

Fork of Activity6_Task2

This stacked bar chart displays the distribution of IMDb movie ratings across six genres, showing the proportion of films within five rating brackets from “below 5.0” to “above 8.5”. Each genre’s bar segments sum to 100%, and hovering over a segment reveals its exact percentage. The visualization uses D3 v7’s `d3.stack()` for data stacking, `d3.scaleOrdinal` for color encoding, and `d3.scaleLinear` and `d3.scaleBand` for positioning. Data comes from a CSV file with pre-aggregated percentages, rendered as SVG with a custom tooltip for interaction.

Hharsha13638@gmail.com
95% match
Loading thumbnail…

Fork of Activity6_task2

This stacked bar chart visualizes IMDb rating distributions across six film genres, showing the proportion of movies falling into five rating brackets from “below 5.0” to “above 8.5.” The chart uses d3.stack to compute layered segments, along with d3.scaleBand and d3.scaleLinear for positioning, and d3.axisBottom for percentage labels. Rectangles change opacity on mouseover, and a custom tooltip displays the exact percentage for each genre-rating combination. Data comes from the included CSV file, rendered as SVG with D3 v7.

Aabjalshaik02@gmail.com
95% match
Loading thumbnail…

Fork of Activity 6_task 2

A stacked horizontal bar chart displays the distribution of IMDb movie ratings across six genres, using percentages from the bundled CSV data. The chart uses D3 v7's `d3.stack`, `d3.scaleBand`, and `d3.scaleOrdinal` to render five rating categories per genre with a custom color scale. Hovering over a bar segment triggers a tooltip via mouse events, showing the exact percentage for that rating segment. Axes are formatted with `d3.axisBottom` and `d3.axisLeft`, while styled tick text and labels come from external CSS.

KKarnam Abinay Goud
94% match
Loading thumbnail…

Fork of Activity 6_Task 2

A stacked horizontal bar chart displays IMDb rating percentages across six genres, with each bar segmented by five rating ranges from below 5.0 to above 8.5. The visualization uses D3 v7 with `d3.stack()` to generate the stacked series and `d3.scaleOrdinal` for color encoding. A custom tooltip, configured on mouse events, reveals the exact percentage for each genre-rating combination, while axes are rendered using `d3.axisLeft` and `d3.axisBottom`. The data comes from a CSV file with precomputed proportions.

Aanusha.chilkamarri26@gmail.com
94% match
Loading thumbnail…

Fork of Activity6-Task2

This stacked bar chart shows the percentage distribution of IMDb ratings across six movie genres, breaking each genre into five rating bins from below 5.0 to above 8.5. Each bar represents 100% of a genre, with colored segments showing the proportion of movies in each rating category. Hovering over a segment reveals the exact percentage for that rating level within that genre. The visualization uses d3.stack and d3.scaleOrdinal to build the stacked layout, d3.axisBottom for the percentage axis, and a custom tooltip with mouseover events to display the precise values. Data comes from a CSV file with pre-aggregated genre-rating proportions.

Ssusarlasruthi2000@gmail.com
94% match