Skip to main content
SimilarExport ZIP
100%

Activity-6 Q3

✓ Published0🌍 Public
KKavyaEti
Last edited Oct 23, 2024
Created on Oct 23, 2024
Forked from Hello VizHub

This example shows a stacked horizontal bar chart of manga readers by genre (Action and Romance) across five age groups, using data from a CSV file. It loads D3 v7 via UNPKG and renders SVG. The code uses `d3.stack`, `d3.scaleBand`, `d3.scaleLinear`, `d3.axisLeft`, and `d3.axisBottom` to construct the chart, with a custom tooltip on mouseover. A legend and axis labels are included, and colors differentiate the two genres.

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…

Activity-6 Q3

This example shows a stacked bar chart of manga readership by genre and age group, sourced from a local CSV file. Each age bracket, from 10-19 to 50 and above, contains segments for action and romance readers, with bar lengths proportional to reader counts. The visualization employs D3.js v7 and renders via SVG, using `d3.stack()` to create the stacked layout, `d3.scaleOrdinal` for genre colors, and `d3.scaleLinear` and `d3.scaleBand` for axes. Tooltips display exact reader numbers on hover.

KKavyaEti
96% match
Loading thumbnail…

Activity-6 Q3

This visualization shows a horizontal stacked bar chart comparing manga readership across five age groups, breaking down readers into Action and Romance genre categories. The code uses D3 v7’s `d3.stack()`, `scaleLinear`, `scaleBand`, and `scaleOrdinal` with a custom color palette to render the SVG. Interactive tooltips appear on mouseover, displaying the specific genre reader count for each segment. The chart includes axis labels, a title, and a legend, with data loaded from a local CSV file via D3’s data-binding methods.

KKavyaEti
95% match
Loading thumbnail…

Activity6_Task2

This stacked bar chart displays how readers rate book genres across three categories (Excellent, Good, Average), with each genre represented by a horizontal bar segmented by rating proportions. The visualization uses D3.js (v7) with an SVG rendering approach, loading data from a CSV file containing genre ratings as percentages. The code employs `d3.stack()` with `stackOrderNone` and `stackOffsetNone` to build the segments, along with `d3.scaleLinear` for the percentage axis and `d3.scaleBand` for genre categories. Users can click any segment to see the exact rating percentage via an alert.

Mmaheshsachin1234@gmail.com
85% match
Loading thumbnail…

Activity 6 Question 2

This stacked bar chart shows movie genre preferences across five age groups, with each bar segment representing the percentage of respondents who rated a particular movie type. The visualization uses d3.stack() to compute cumulative values and d3.scaleOrdinal with a custom color palette to distinguish categories. Mouse interactions trigger tooltips that display exact percentages, while d3.axisBottom and d3.axisLeft render the axes with gridlines. The data originates from a CSV file, and the chart is rendered as SVG using D3 v7.

Ttallapanenisahithi@gmail.com
84% match
Loading thumbnail…

Activity6_Question_2

This stacked bar chart shows the distribution of book ratings across six genres, with each bar representing the percentage of ratings falling into five categories from “Below 5.0” to “Above 8.5.” The visualization uses d3.stack() to create the stacked segments, d3.scaleOrdinal for color encoding, and d3.scaleBand for the genre axis. Hovering over any segment displays a tooltip with the exact percentage for that rating category. The chart is rendered as an SVG using D3 v7, with data loaded from a CSV file.

Ssaimanvith22@gmail.com
83% match
Loading thumbnail…

Activity6_Task2

A stacked horizontal bar chart displays the distribution of IMDb ratings across six genres, with each genre broken into five rating percentage bands. The visualization reads a CSV file and uses D3 v7's `d3.stack`, `d3.scaleOrdinal`, `d3.scaleLinear`, and `d3.scaleBand` to render SVG rectangles, while tooltips on hover reveal the exact percentage for a rating band. Axis labels and a title clarify the chart, and the color palette distinguishes rating categories.

PPothuguntla Pranitha
83% match
Loading thumbnail…

activity6_q2

This example shows stacked horizontal bars comparing the percentages of IMDb movie ratings across different genres, with each bar segment representing a rating range from "below 5.0" to "above 8.5". It uses D3 v7's `d3.stack`, `d3.scaleOrdinal`, `d3.axisBottom`, and `d3.axisLeft` to create the chart, rendered as SVG. The data is loaded from a CSV file, and hovering over a segment displays a tooltip showing the exact percentage for that genre and rating category. The chart includes a title and an x-axis label, with legends omitted.

Bbhavyamoturi2509@gmail.com
83% match
Loading thumbnail…

Activity6_Question2

This stacked bar chart visualizes the distribution of book ratings across six literary genres, with each bar divided into four rating categories from below 3.0 to above 4.5. The visualization uses D3 v7 with an SVG renderer, employing d3.stack for data transformation, d3.scaleOrdinal for color mapping, and d3.scaleBand for the categorical y-axis. Interactive tooltips appear on mouseover to display precise percentages for each rating segment, with data loaded from a local CSV file.

Gganeshseeram5decem@gmail.com
83% match