New project – baseball division race charts!

Check it out!

I love looking at these charts because it’s such a great way to tell stories about the season. For example, this season it felt like the Astros were 1-2 games back of the Athletics for an unreasonable length of time, and you can see that from about mid-May to mid-June this was absolutely true!

And just as another example this year, this graph of the Diamondbacks is especially grim:

Some notes:

  • Very early on in the process I found this interactive chart that does essentially the same thing as mine. But I think mine is a bit easier to view – I like having a bigger y-axis. And I did learn how to implement dark mode for a website – this article by Ryan Feigenbaum was very helpful!
  • For the graphs I used Plotly, which is kind of a big download but is extremely customizable and I got a lot of stuff for free. It’s pretty nice!
  • Another thing I didn’t like about the other interactive chart was the line colors – they seem hard to distinguish. I thought it would be easy to pick team colors, but it turns out a lot of teams have similar colors, so trying to find different colors for 5 teams that are distinguishable and show up on a light/dark background is very tricky! (this is why the Use Team Colors option exists, in case the colors are too close together…)
  • Since the app itself is pretty simple, I decided to not use React or any Javascript framework, but I did once again attempt to figure out Webpack. And I got it “working” except the HTML file doesn’t get copied over in the development server, only when I build. Maybe next project I’ll get things working better…

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google photo

You are commenting using your Google account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s