Ece Karaca's profile

P5.js Interactive Data Viz. Examples

Programming language: p5.js
Coded by me
Data: Population of cities in Syria, gathered from various resources around web.
This is one of my first interactive coding trials. My first aim was working with csv file format. So, javascript code pulls the data from a csv file which is sitting on the same folder with rest of the files like .js, and .html. 
It is a simple, mouse rollover interaction. Names are ordered from largest to smallest city populations. 2004 is the last official Cencus data record from Syria. I did a lot of research, visiting several websites to pull reliable, updated data. However, rest of the data is not from a single, reliable resource like 2004 Cencus. You can observe the population drop after 2012 and 2013. Syrian Conflict has started on 2011 and population started to decrease drastically. However, there is no single, reliable resource that might be helpful to verify the population data in an ongoing war environment.
You can try the interaction from the link. Data and code file accessible on this link. Click on index.html to interact with the interface please!
Same data visualized in Tableau. I spent over 25 hours to write the code and fix problems of javascript files, but putting an excel file to Tableau and visualizing an interactive layout took less then 20 minutes. Tableau is a great resource when it comes to numeric data visualization. I always put data on Tableau to recognize main data patterns, which raise more questions and give new directions to data exploration. When comes to a mixture of qualitative and quantitative data visualization, programming is almost always mandatory. To be able to visualize unique, interesting, and complex data, I need to be able to understand and manipulate code. Also, programming offer unlimited interaction patterns, but Tableau is pretty straightforward on interaction and visual layout.
Also, programming is open source, so I can publish this p5.js sketch on a website, but Tableau requires a public profile to publish the data, then access to API to publish the data interactively. That's why I didn't get a chance to share the interactive sketch from Tableau.
P5.js Interactive Data Viz. Examples
Published:

P5.js Interactive Data Viz. Examples

Interactive data visualization application

Published: