Fork of Stacked Franchise Revenues by Revenue Category

100%

Fork of Stacked Franchise Revenues by Revenue Category

✓ Published0🌍 Public

Last edited Oct 23, 2023

Created on Oct 23, 2023

Forked from Stacked Franchise Revenues by Revenue Category

This stacked bar chart visualizes franchise revenue by category across different franchises, using data from TidyTuesday. The visualization, built with d3.js, shows revenue categories as stacked segments within each bar. Interactive highlighting is implemented by hovering over the legend, which fades out other categories while keeping the hovered one prominent. The chart uses d3.legend for the interactive color legend, d3.tip for tooltips on hover, and custom axis formatting that converts the revenue scale to billions.

AI-generated description

This visualization was originally forked from one of Curran Kelleher's stacked bar chart examples and modified to include Franchise Revenue data which originates from R for Data Science's Tidy Tuesday weekly event for July 2, 2019.

This visualization serves as a companion chart to the previous scatter plot, contrasting its view with a stacked bar chart and a legend with interactive highlighting. The next goal is to combine the two visualizations, their styles, and their techniques into one cohesive view.

MIT Licensed

Similar vizzes

Loading thumbnail…

Fork of Stacked Franchise Revenues by Revenue Category

This interactive stacked bar chart displays franchise revenues broken down by revenue category, using data from R for Data Science’s Tidy Tuesday. Built with D3.js, it includes an animated color legend that highlights specific layers on hover, while dimming others. A tooltip via d3-tip shows dollar amounts in billions. The chart uses d3.layout.stack, d3.svg.axis, and d3.legend.color, with SVG rendering and custom tick formatting for readability.

XXiaoyu Su

97% match

Loading thumbnail…

Stacked Franchise Revenues by Revenue Category

This stacked bar chart displays franchise revenues by revenue category, with bars segmented by category and a color legend that highlights individual layers on hover. The visualization, rendered as SVG, uses D3.js to scale the x-axis in billions and the y-axis by franchise name, with tooltips providing exact revenue figures. It incorporates the d3.legend and d3.tip APIs for interactive legend highlighting and informative tooltips, while the data comes from Tidy Tuesday’s 2019 franchise revenue dataset. The chart is built upon a forked stacked bar example, layering semi-transparent overlays to emphasize selected categories during mouse interaction.

Yyuzhang21

94% match

Loading thumbnail…

Stacked Franchise Revenues by Revenue Category

This stacked bar chart shows franchise revenues broken down by revenue category, with each bar representing a franchise and stacked segments colored by category. Hovering over the legend highlights the corresponding category and dims others, while a tooltip displays exact revenue values in billions. Built with D3.js version 3, it uses `d3.layout.stack` for stacking, `d3.legend.color` for the interactive legend, and `d3-tip` for tooltips. The data comes from Tidy Tuesday’s July 2019 franchise revenue dataset, rendered as an SVG with animated transitions.

Ssophburke

94% match

Loading thumbnail…

Stacked Franchise Revenues by Revenue Category

This stacked bar chart shows franchise revenues broken down by revenue category, with each bar segment representing a category and the full bar height showing total revenue. An interactive legend allows users to highlight specific categories, dimming others and displaying tooltips with precise billion-dollar figures. Built with D3.js version 3, it uses d3.layout.stack for stacking, d3.legend for the color legend, and d3-tip for hover details. The data comes from Tidy Tuesday’s July 2, 2019 franchise revenue dataset, rendered as an SVG with animation support.

Vvwm

94% match

Loading thumbnail…

Stacked Algorithm Results Evaluation

This stacked bar chart evaluates franchise revenue performance, breaking down each franchise's total earnings into color-coded revenue categories. Interactive highlighting via the color legend filters and emphasizes specific segments, while a semi-transparent overlay dims non-selected bars. The visualization uses D3.js with d3.layout.stack for layering, d3-legend for the interactive legend, and d3-tip for hover tooltips showing revenue values in billions. Data comes from Tidy Tuesday's 2019 franchise revenue dataset, rendered as an SVG animation.

Yyuzhang21

89% match

Loading thumbnail…

Franchise Revenues - Revenue by Franchise

This chart displays franchise revenue by franchise name using horizontal bars, with color encoding for revenue category and a tooltip showing the original media type. It filters data to include only franchises with revenue above 10 units, highlighting how merchandise dominates the field. The visualization is built with the Vega-Lite API, using d3.csv for data loading and rendering via vega-tooltip for interactive hints. Revenue data comes from the Tidy Tuesday franchiseRevenues dataset.

Vvwm

82% match

Loading thumbnail…

Franchise Revenues (Category and Total) with Selectable Color Axis

This interactive scatterplot displays franchise revenues across categories and totals, with selectable axes for X, Y, and color encoding. Users can switch between revenue, total revenue, revenue category, original media, and year created using React dropdowns. The visualization uses D3 v5 scales to map data from the Tidy Tuesday Franchise Revenue dataset to SVG circles, with a legend showing eight generalized media types. Marks include opacity to reveal overlapping categories when viewing total revenue across the color axis, with hover tooltips showing franchise names.

Vvwm

78% match

Loading thumbnail…

LAB5!

This bar chart shows total revenue by franchise, colored by revenue category, with data filtered to include only franchises earning over $10 million. The visualization highlights that merchandise dominates franchise earnings, with Marvel standing out in movie revenue and Shonen Jump leading in manga. Built using the Vega-Lite API with d3.v5 for CSV loading, the chart encodes franchise on the x-axis, revenue on the y-axis, and uses tooltips to display the original media type. The data comes from a Tidy Tuesday dataset on franchise revenues.

Llimeroc

76% match