MAT 259 - 2011W

Yun Teng | Project 3 | 2D Animation

Book Network


This project organizes books with dewey numbers by the time they were checked out. The assumption is that books checked out at the same time are borrowed buy the same person. So a relationship is established among these books(belong to the same node). If a book in the current node is checked out next time, the node at that particular time becomes a descendent of the current node. Color represents the category of the book.


Source Code

Data Parsing

I used mysql to query out all the transactions in 2010 and sorted them by check out time. Then I built two hashmaps barcodeHash and ckoutTimeHash. BarcodeHash uses barcode as key and stores the book name and all the checkoutTime of that item. ckoutTimeHash uses checkoutTime as key and stores all the barcode checkedout at that particular time. These two are the essential elements to establish my tree (a DAG to be specific). At first I got stack overflow for too many recursions(because there were loops in my tree which shouldn't happen). It took me a long time to debug the code.

Project Evolution

At first I was thinking of making a static 3D network. But as I got 16,000 nodes, it was impossible to draw all of them at the same time(I once tried and it took half an hour to draw them in 3D). Then I tried 2D which would took about 2 minutes to draw and I got a mess.

All nodes without color adaption:

All nodes without adaption:

For the final version, I got my inspiration from They Rule, which aims to provide a glimpse of some of the relationships of the US ruling class. So I made my tree fully interactive. Left click on the node to expand and right click to hide. By default the new nodes will spread out evenly in a 360 degree around there parents. But you can drag them wherever you like. Point at an expanded node will show the item it got from its parent. And all the checkOut history of that item will appear on the tree graph. Point at an expanded node will show the information of all the books checked out at that time. But you can hide this information if you fill it gets too messy.


This project is too big to put online. So I made a screen-shot video to demonstrate. Please fill free to download the data and source code and play with it.