[ICM] Final pt.2: Dota 2 and API


Make a final project.


I was thinking a lot about making a Dota 2 related ICM project because it has great API and a lot of stats. I thought at first to make a word cloud, but thought that it wouldn’t be as interactive and instead decided to make a concept Hero picking screen.

I chose Dota 2 because of its extensive amount of stats and because I worked with it in a class for statistics before. It’s the most prized esports video game ever, and even though esports aren’t especially popular these days, they make more money than some professional athletes of physical sports. Rory McIlroy, a golfer, received $15 million for winning the 2019 PGA tour. Team OG won over $10 million for winning only the The International 2019. It is important to mention that OG won over $10 million for The International 2018 as well. Not to mention all the other tournaments that players participated in previous to the most important one for Dota 2.

That is just Dota 2. There are other competitive video games out there such as Counter-Strike: Global Offensive, League of Legends, Rocket League, Overwatch, etc. Stats in these game are extremely important. Knowing when and how and how much – it all counts. This is certain people’s livelihood these days. It was not this way a mere decade ago.

My Project

My project did not involve an amazing amount of data and stats. But it can. It’s entirely possible and easy to do, it’s just a matter of time and depth. The fact that you can extract API data and insert it into p5.js and make it all appear in a matter of seconds is super cool. I merely made a list of heroes (playable characters of Dota 2) appear in order that they are listed in API and attached their images to single one of them. To do that I downloaded their portraits and named them from 0 to 118, since there are 119 heroes. All these heroes are playable characters in Dota 2, which by the way is a free to play game.

I wanted to make it personal to me at first. For example, how many times have I played this or that particular hero. In the end I opted out to making it more personal.

Each hero shows whether they are melee or ranged and displays their main attributes (agility, strength, or intelligence). Also displays their name. I thought that people would be interested in their names based on the portrait of each hero.


Getting the API to work was not a problem. After all, the print function showed me that it loads data from the API. But understanding how to extract that data and visualize took a lot of time. I was not sure where to begin a lot of times.

Making each grid cell longer was extremely tough.


Playing with data is a lot of fun, but making it work out in your favor in p5 can be quite challenging. Perhaps in the future I will make a site for beginners of Dota 2.

looks like an image, but it’s in p5!

Thank you

To everyone who has aided me along the way! Especially Cezar and Zack.

Big thanks to my teacher Cassie Tarakajian for teaching me all the javascript code to begin with.

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