Skip to main content
SimilarExport ZIP
100%

activity_6_task2

✓ Published1🌍 Public
11810vineeth@gmail.com
Last edited Oct 22, 2024
Created on Oct 22, 2024
Forked from Hello VizHub

This example presents 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 one of five rating brackets. The chart uses D3 v7’s `scaleLinear`, `scaleBand`, `scaleOrdinal`, and `stack` API to compute and render the stacked bars from CSV data. Interactive tooltips, implemented with D3 selections and event handlers, display the exact percentage for each genre-rating combination on mouseover. The visualization is rendered as SVG within a 960×500 canvas, with axes labeled and styled via external CSS.

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 displays a stacked horizontal bar chart showing IMDb movie rating distributions across six genres, with proportions for rating brackets below 5.0 through above 8.5. The visualization uses D3 v7’s `d3.stack()` and `scaleOrdinal` to create the layered bars, while `d3.axisBottom` and `scaleBand` handle axes and genre categories. Interactive tooltips appear on mouseover, showing precise percentages using the `d3.format` function. The bars are rendered as SVG rectangles with data loaded from a local CSV file.

Vvamsikrishnakanchukommala@my.unt.edu
96% match
Loading thumbnail…

Activity6_Task2

A stacked horizontal bar chart displays the percentage of IMDb movie ratings across six genres, broken into five rating brackets from below 5.0 to above 8.5. The chart uses D3 v7’s `d3.stack` and `d3.scaleBand` to generate the bars, with `d3.scaleOrdinal` assigning distinct colors to each rating category. Interactive tooltips appear on mouseover, showing the exact percentage for a specific genre and rating bracket. Data comes from the included CSV file, and the visualization renders as SVG.

Kkrishnavisheshkatta@my.unt.edu
96% 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…

Activity-6_Task2

This example shows a stacked horizontal bar chart 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 v7 to load CSV data and render SVG elements. It employs d3.stack() to compute the stacked series, d3.scaleBand for the genre axis, d3.scaleLinear for the percentage scale, and d3.scaleOrdinal for color encoding. Interactive tooltips appear on mouseover, displaying the exact percentage for each rating segment using d3.format.

VVasanth Krishna
96% match
Loading thumbnail…

Activity6_Task2

This example uses a stacked horizontal bar chart to compare the percentage distribution of IMDb movie ratings across six genres, with each bar segment representing a rating range from below 5.0 to above 8.5. The visualization, rendered as SVG, loads data from a local CSV file and uses D3 v7’s `d3.stack()` to create stacked bars, `d3.scaleOrdinal()` for color encoding, and `d3.axisLeft()` and `d3.axisBottom()` for axes. Interactive tooltips appear on mouseover, displaying the exact percentage for each genre-rating combination.

Hhaneesh@gctc.in
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 task 2

A stacked horizontal bar chart displays the percentage distribution of IMDb ratings across six movie genres, using five rating categories from "below 5.0" to "above 8.5." The chart shows proportions per genre via color-coded segments, with a tooltip revealing exact percentages on hover. Built with D3 v7, it uses `d3.stack()` to compute stacked series, `d3.scaleBand()` for genre positioning, and `d3.scaleLinear()` for the percentage axis. Data comes from an external CSV file, rendered as SVG within an HTML page, with axis labels and a title included.

Vvishnutejareddyambati@my.unt.edu
96% match
Loading thumbnail…

Activity6 task2

This example visualizes IMDb movie ratings across six genres using a horizontal stacked bar chart, with each bar divided into five rating brackets from below 5.0 to above 8.5. The chart is rendered as an SVG using D3 v7, loading the data from a CSV file and employing `d3.stack` for the stacked layout, `d3.scaleBand` for the genre axis, and `d3.scaleOrdinal` for color mapping. Interactive tooltips display the exact percentage for each rating segment on hover.

BBhavana Sharma
96% match