Skip to main content
SimilarExport ZIP
100%

act8_task2

✓ Published0🌍 Public
Rravularasesh3102@gmail.com
Last edited Apr 13, 2024
Created on Apr 13, 2024
Forked from Hello VizHub

This horizontal stacked bar chart visualizes the proportional distribution of movie ratings across genres, with each bar divided into colored segments for action, comedy, drama, thriller, and horror. Built with D3 v7 and rendered as SVG, the chart uses d3.stack(), d3.scaleBand(), and d3.scaleLinear() to position segments, while d3.axisBottom with gridlines and custom tooltips display exact percentages on hover. Data comes from a static CSV file loaded locally.

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…

act8_task2

This example presents a stacked horizontal bar chart of movie ratings by genre, with each genre row segmented proportionally across categories like Action, Comedy, and Drama. Hovering over a segment reveals a tooltip with the exact percentage. Built with D3 v7, the visualization uses `d3.stack`, `d3.scaleOrdinal` for the categorical color scheme, and `d3.axisLeft` and `d3.axisBottom` for axes. Data is loaded from a CSV file, and all rendering is done to an SVG canvas.

Rravularasesh3102@gmail.com
94% match
Loading thumbnail…

act8_task2

This visualization presents a horizontal stacked bar chart showing the distribution of movie ratings across six genres, from Documentary to Action. The chart uses D3.js v5 with SVG rendering, employing a band scale for genres and a linear scale for percentage values. Interactive tooltips display exact percentages on hover. The code demonstrates D3's stack, scaleOrdinal, and axisBottom APIs, along with custom styling via the Yanone Kaffeesatz font.

Rravularasesh3102@gmail.com
93% match
Loading thumbnail…

Activity 8_task 2

This stacked bar chart visualizes movie ratings by genre, with each bar showing the percentage distribution across action, comedy, drama, thriller, and horror categories. The chart uses a horizontal layout with a linear x-axis for percentages and a band scale for genres, coloring each segment distinctly. Built with D3 v7, the visualization renders as SVG and includes interactive tooltips on mouseover that display the exact percentage for each genre-rating combination. The data is loaded from a CSV file and processed using D3’s stack layout and scaleOrdinal for color mapping.

Sshivasaikumart@gmail.com
93% match
Loading thumbnail…

activity8_task2

A stacked bar chart visualizes the proportional ratings of five movie genres (Action, Adventure, Comedy, Drama) across five rating categories (action, comedy, drama, thriller, horror). Each horizontal bar is segmented by category, with segment lengths proportional to the percentage values from a CSV file. The chart uses D3 v7’s stack, scaleOrdinal, scaleLinear, and scaleBand APIs, rendered as SVG rectangles with hover tooltips showing exact percentages. Axes are drawn with d3.axisLeft and d3.axisBottom, and the visualization includes a legend and title.

Aajaykumarakula00@gmail.com
93% match
Loading thumbnail…

act8_task2

This example shows the distribution of IMDb movie ratings across six genres, using a horizontal stacked bar chart where each bar segment represents the proportion of movies within rating brackets below 5.0, 5.0-6.5, 6.5-7.5, 7.5-8.5, and above 8.5. It loads D3 v7 via UNPKG and uses `d3.stack`, `d3.scaleLinear`, `d3.scaleBand`, `d3.axisBottom`, and `d3.axisLeft` to render the SVG. Hovering over a segment displays a tooltip with the exact percentage for that genre and rating bracket.

Rravularasesh3102@gmail.com
90% match
Loading thumbnail…

Activity8_Task2

A stacked bar chart displays the percentage distribution of movie ratings across six genres, from documentary to action. Each bar represents a genre, with colored segments showing five rating ranges from below 5.0 to above 8.5. Hovering over a segment highlights it and reveals the exact percentage via a tooltip. The visualization uses d3.v7 with d3.stack, d3.scaleOrdinal, and d3.scaleBand, rendering as SVG from CSV data.

LLakshmi Keerthi
90% match
Loading thumbnail…

Activity6_Task2

This stacked bar chart shows the distribution of movie ratings across six genres, with each bar segmented by five rating bands from “below 5.0” to “above 8.5.” The visualization reveals genre-specific trends, such as Horror having a larger share of low ratings compared to Musical. Built with D3 v7, the chart uses `d3.stack()` to compute stacked segments and `d3.scaleLinear` for the percentage axis. Hovering over a bar segment triggers `mouseover` and `mousemove` events, displaying a tooltip with the exact percentage for that genre and rating level. Data comes from an external CSV file, rendered as SVG.

AAP19110020041-Pavan Kumar
90% match
Loading thumbnail…

Activity6_Task2

This example displays a stacked bar chart of movie ratings by genre, with each bar broken into colored segments for action, comedy, drama, thriller, and horror categories, based on data from `data.csv`. Using D3 v7, it applies `d3.stack()` to create the layered segments, `d3.scaleBand()` and `d3.scaleLinear()` for axes, and `d3.axisLeft()` and `d3.axisBottom()` for tick marks. Interactive tooltips appear on mouseover, showing the percentage for each segment.

Sshivakumarganji@my.unt.edu
89% match