PokeMap

février 14, 2015 dans Perso, Projects par Maxime

Project: PokeMap
Link: http://www.transwalkers.com/pokemon/pokemap.htm

pokemap

Idea: Some weeks ago, I see the web site of Data-Driven Documents, an amazing library for javascript that display many vizualisation layouts for hierachical data. I jump in the list of examples, and try some. Here, I present you what we can do with online shared data and a good visualization library.

Objectif: Display in cool way, the number of PoKeMoN for each type. ^_^

  • 1 step: Find the data. All the data of PoKeMoN are enable on the web in a deposit, and easily accessible through an API. See PokeAPI
  • 2 step: Format the data. D3.js include some functions to import data, and particularly one for json files. PokeAPI display json data, but I need some modifications to fit with my needs. So I make this script. I have some problems with the asynchronicity… For the moment I print my json string in the console.log and copy/past it in my json file… Sorry, I work on better way. Final json file : -here-
  • 3 step: Build the vizualization. Final step, adapt the example of D3 Treemap layout for my goal

Enjoy the Final Result !!

Thanks to PokeAPI and its authors
Thanks to Data-Driven Documents and its authors