Figure Friday 2025 - week 5

Dash Python
28

Hey everyone,

I finally had some time to create a dashboard again! :raised_hands:

How Can the Initial Visualization Be Improved?

The chart shows two variables: Current Players and Price.

  • The histogram does a great job of displaying the spread between players and price bins.
  • The scatter plot, however, lacks clarity. It’s not obvious that each dot represents a game, and without a legend, it’s even more confusing. Plus, the dots overlap, making it hard to differentiate between games, especially in the lower ranges.
  • The third marginal plot doesn’t add much value either. It’s too clustered in the lower ranges, making it difficult to see the extent of the overlaps.

If the goal is to visualize the spread of players across different price categories, the histogram alone would have been enough for me. :slightly_smiling_face:

App Built with Vizro

I’ve created a Dash app using Vizro. Here’s what I did:

First Page: I created an overview with some summary statistics and some different visualizations of player numbers and prices. One visualisation would have been sufficient, but I just wanted to show how these 3 different charts are differently suited depending on what we want to analyse.

  • Bar Chart: Perfect for quickly identifying the top games. It’s sorted, so rankings are easy to see, and price is indicated by color, showing that the most popular games are free. The bar chart becomes a bit more difficult to read if you visualize more entries, so I’ve added a parameter in there that only displays the top N, where N is configurable via the control.
  • Treemap: A variation of the bar chart. It’s better for seeing the share of each game compared to the total. However, it’s harder to compare rankings because comparing areas is trickier than comparing lengths.
  • Scatter Plot: Usually great for spotting correlations. I improved the original by adding opacity, making more dots visible. Still, it’s my least favorite choice because of overlapping dots, especially in the lower ranges.

Last Page: I added a table view. Honestly, it’s my favorite visual from the dashboard. Big shoutout to @AnnMarieW here! Her repository on Dash-Ag-Grid examples helped me a lot in achieving the styling I wanted. Adding Bootstrap components to the Dash-Ag-Grid was a visual game changer for me! :star2:

nguyen-figure-friday-5

Code: li-nguyen/figure-friday-week-5 at main
App: Games Dashboard - a Hugging Face Space by li-nguyen

10 Likes