No description, website, or topics provided.
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.

Map Explorer Webapp

This Html5/Angular app is my entry for the Riot Api Challenge

Technology Used

What does it do?

This Single-Page-Application provides the service of a map replay, select a game and go through the time intervalls of a game to see the current stats, positions and events (not jet implemented) of all the players

How do I get it to run?

Copy the repository to your machine and open the index hmtl in the project root dir. It should display three different options to choose a game from

Also the backend has to be running (see the Readme of the backend repository)


It works only for EUW games at the moment ... well this is rather an missing feature than a feature ... sorry, I may fix that if I am home early enough

Game Selection :

  • Random Urf Game (due to time issues just a random game out of 1 bucket (see backend))
  • From a players match history
  • Via a match id (Riot match id (The input can just be retrieved via the api ?!?)) mainly for debugging purpose


  • Click a player champion image to focus the champion on the side and on the map
  • Controlls to change the Intervall (in Minutes(due to the interval length returned from the api)
  • Animated Movement of the Champions


  • I use the html5 local storage feature to cache all the static data client side
  • Also the match data with the id as the key
  • Currently there is no Expiration for the static data

All other features should be self-explanatory


I couldnt finish or start a lot of features i wanted to implement, here is a list which things i will finish in the future

  • Handle events returned by the api (wards placed, monsters killed, kills ...) and visualise them
  • Enhance the UI (I should get some help there ...)
  • Tidy up the code (There is some redundant code which could be moved out of controllers), also some controllers are way to crowded
  • Implemenet an error handling with a good description about it
  • Move some code to the server which doesnt have to be client handled
  • Apply more correct angular to this app
  • Serverside caching
  • At some points I did use data dragon urls directly because I had not enough time left to go via the static data api
  • ...