I wanted to use Voronoi's regions because I think they are a cool visualization. I thought it'd be really cool to have them change live based on some stream of data. I ended up using a Treemap instead as Voronoi's regions are not the best use way to represent frequencies (but distances instead).

What it does

It shows beautiful tiles that represent cryptocurrencies being traded live. Ideally, in times of high volumes, they would be fighting for the biggest area on the screen.

How I built it

D3, hosted on Google App Engine, uses Flask for the back-end, as intermediary between D3 and the financial data API provided by GDAX (Coinbase company).

Challenges I ran into

So many. I had to learn D3, Google App Engine, Flask and countless hours of debugging.

Accomplishments that I'm proud of

This is my first submission after 4 hackathons. I also basically finished the project, given my obstacles on the way. SUPER PROUD.

What I learned

The technologies mentioned above, and probably a good deal of debugging skills. Also that I can code for 16-18 hours straight (ish).

What's next for CryptoBattles

Uhhh, ideally have it stream data using WebSockets instead of a REST API, and using more hip frameworks, such as React, or WebAssembly, and asynchronous calls (NodeJS back-end & stuff). Also, it'd be nice to use it for stocks, twitter (to visualize the most commonly used words for example), and other things.

Share this project: