Skip to main content
SimilarExport ZIP
100%

Activity6_Question2

✓ Published0🌍 Public
JJhansi Balla
Last edited Oct 24, 2024
Created on Oct 24, 2024
Forked from HTML Starter

This stacked bar chart shows the distribution of music ratings across five social media platforms (Twitter, Instagram, TikTok, Facebook, Snapchat), split into five rating brackets from below 5.0 to above 8.5. Each bar represents a platform, with colored segments showing the percentage of ratings in each bracket. The visualization uses D3 v7’s `d3.stack()` and `d3.scaleOrdinal` for color encoding, rendered as SVG with a tooltip on mouseover displaying exact percentages via `d3.format`. Data comes from a local CSV file.

AI-generated description

A bare minimum HTML page demonstrating use of CSS and JavaScript.

See also React Starter.

MIT Licensed

Similar vizzes

Loading thumbnail…

Activity6-Question2

This stacked horizontal bar chart shows the distribution of music ratings percentages across five platforms: Spotify, YouTube, Apple, Amazon, and Tidal, segmented into five rating categories from below 5.0 to above 8.5. Each bar segment’s length corresponds to the proportion of ratings in that category, with hover interactions revealing exact percentages via a tooltip. Rendered with D3 v7 using `d3.stack()` and `d3.scaleOrdinal` for coloring, it employs SVG axes from `d3.axisBottom` and `d3.axisLeft`, reading data from a CSV file. The chart includes a legend and uses percentage labels formatted with `d3.format`.

Ssushanthkodipyaka@gmail.com
90% match
Loading thumbnail…

Activity-6_Q2

This stacked bar chart visualizes the percentage distribution of music rating categories (below 5.0 to above 8.5) across five streaming platforms, including Spotify, YouTube, Apple, Amazon, and Tidal. Each horizontal bar segment represents a rating category’s proportion, colored via a categorical scale, with hover tooltips showing the exact percentage for each genre. The visualization uses D3.js v7, employing `d3.stack()` for data stacking, `d3.scaleBand()` for the y-axis, and `d3.axisBottom()` for the x-axis. SVG rendering with custom CSS styles and a legend displays the data from the provided CSV file.

Ggreeshmareddy135@gmail.com
88% match
Loading thumbnail…

Activity6-Question2-upd

This stacked horizontal bar chart visualizes the distribution of ratings across five streaming platforms, showing the percentage of content falling into each rating bracket from below 5.0 to above 8.5. The chart uses d3.stack() to compute the stacked segments, with d3.scaleBand for the categorical y-axis and d3.scaleLinear for the percentage x-axis. Tooltips provide exact percentage values on mouseover, and a color-coded legend identifies each rating category. The data originates from a CSV file listing OTT platforms and their rating proportions.

Mmeenam1106@gmail.com
87% match
Loading thumbnail…

Activity6

A stacked horizontal bar chart titled "Music" visualizes the percentage distribution of music ratings (below 5.0 to above 8.5) across five streaming platforms (Spotify, Youtube, Apple, Amazon, and Tidal). The chart uses D3.js v7’s `d3.stack`, `d3.scaleOrdinal`, and `d3.scaleLinear` to construct layers for each rating category, with an interactive tooltip on mouseover. Data is loaded from a local CSV file and rendered as SVG, with D3’s `axisBottom` and `axisLeft` for axes.

Ggreeshmareddy135@gmail.com
87% match
Loading thumbnail…

Activity6_Question2

This stacked bar chart displays the distribution of user ratings across five tech categories, with each bar proportionally segmented from "below 5.0" to "above 8.5." Using d3.scaleBand for the categorical y-axis and d3.scaleLinear for the percentage x-axis, the chart employs d3.stack to compose the segments. A hover tooltip reveals exact percentages per segment, with the data loaded via d3.csv. SVG rendering and smooth opacity transitions for the tooltip enhance interactivity.

Bbhargavr016@gmail.com
86% match
Loading thumbnail…

Activity6-Question2

This example displays a horizontal stacked bar chart comparing the ratings distribution (below 5.0 to above 8.5) across music streaming platforms like Spotify, YouTube, and Apple. The contoured bars use a gradient-filled legend, and hovering over a segment reveals the exact percentage via a tooltip. The code uses D3 v7’s `scaleLinear`, `scaleBand`, `scaleOrdinal`, and `stack` APIs to process the CSV data and render the chart as SVG.

MMounishAllam@my.unt.edu
86% match
Loading thumbnail…

Activity6_Question2

This stacked bar chart displays the percentage distribution of ratings across six categories (Technology, Finance, Healthcare, Education, Sports, Entertainment), with each bar segmented into five rating ranges from below 5.0 to above 8.5. The visualization uses d3.stack to compute cumulative segment positions, d3.scaleBand for the categorical y-axis, d3.scaleLinear for the percentage x-axis, and d3.scaleOrdinal for color encoding. Interactive tooltips appear on mouseover, showing the exact percentage for each rating segment, while the SVG rendering includes axes with tick marks and custom styling from the linked CSS.

Ssaisnehapalle@my.unt.edu
85% match
Loading thumbnail…

Activity6_Task2_Q2

This example uses a stacked horizontal bar chart to display the distribution of app ratings across categories like Social Media and Gaming, with each bar segment representing a rating range's percentage. Built with D3 v7, the visualization relies on `d3.stack`, `d3.scaleBand`, `d3.scaleLinear`, and `d3.axisBottom` to compute and render segments from the CSV data. Tooltips, implemented via D3 selection and mouse events, display exact percentages on hover. The SVG output uses a custom color scale for the five rating categories.

KKondreddy Saikiran reddy
85% match