yuqing35

@yuqing35·3 public vizzes

Untitled

This visualization shows the percentage distribution of movie ratings across six genres, from below 5 to 8.5 and above, revealing how genre impacts audience scores. It uses d3.csv to load the data and d3.scaleBand for the categorical x-axis, with d3.scaleLinear mapping the y-axis to the cumulative proportions. Each genre’s total is represented as a single steelblue bar, while hovering turns the bar brown. The chart is rendered as an SVG with d3.axisBottom and d3.axisLeft for the axes, and styled via external CSS.

Dec 16, 2022

Loading thumbnail…

Movie ratings_latest

This stacked bar chart shows the percentage distribution of movie ratings across six genres, revealing how genres like Documentary skew toward higher ratings while Action films cluster below 5.0. Each bar is segmented by five rating brackets, with tooltips displaying exact percentages on hover. The visualization uses D3 v7’s `d3.stack()` and `d3.scaleOrdinal()` for color encoding, with `d3.axisBottom` and `d3.scaleBand` for layout. Data comes from a CSV file containing genre-level rating proportions.

Dec 16, 2022

Loading thumbnail…

Movie ratings_test

This stacked bar chart displays the distribution of five rating categories across six movie genres, showing how rating percentages vary by genre. Each horizontal bar represents a genre, segmented into colored bands for ratings below 5.0 through above 8.5, with a legend on the right. The visualization uses d3.csv to load data and d3.stack to compute the stacked segments, with d3.scaleBand for the y-axis and d3.scaleLinear for percentages. Interactive tooltips appear on hover via mouseover events, highlighting specific rating proportions.

Dec 15, 2022