Author: Petrando

Facebook Topic Visualisation

I asked a question on a facebook group : “Is a very strong understanding of CSS important for web programmer?” Here are the visualised result of the discussion.

The barchart represents people comment. Hover/touch it to see the comments. The bubble represents people emo-reaction, try touch/click them. ‘Search Participants’ is self-explainatory.

Search Participants

Nested Stacked Barchart : Indonesian Civil Cervants (2007-2012)

Ever heard of stacked barchart? Well, this one is on another level…

This is a nested stacked barchart, aims to visualise the body structure of the Indonesian Civil Servants, which is consists of ranks, sub-ranks, men and women.

Hover/touch the bars to display informations. Play with the controls : Rank, Sub-rank and Gender. Use the Sort when available, when it is not (that is when ‘Gender’ is currently checked),click/touch male or female legend on the right before sorting.

Experiment with the controls : do you understand the body structure of Indonesian Civil Servants after playing with them?

Choose Year Data :

Graph by :

Note : experimental, still not perfect.
The fullwidth version of this graph is here :

And the Indonesian version of fullwidth view here :

British Monarch Family Tree : Force Directed Graph

Interactive Family Tree of the British Monarch, from Queen Victoria to the current Queen Elizabeth II’s grand-children’s children.

How to use : 

  • Mouse scroll/finger pinch to zoom.
  • You can drag the tree.
  • Use the ‘SEARCH’ function to search any family member.
  • The ‘RESET’ button on the upper-left for reset tree zoom and positioning.

The above is just a screenshot. To explore this one of my most exciting visualisation, click below. Now responsive for mobile devices: