1. Visualize Your Source Code with CodeFlower
3/7/2013 12:31:18 PM
Visualize Your Source Code with CodeFlower
App Developer Magazine
Visualize Your Source Code with CodeFlower

Visualize Your Source Code with CodeFlower

Richard Harris Richard Harris in Programming Thursday, March 7, 2013

Do you ever wonder what your source code would look like if it could be represented in a picture?

The CodeFlower experiment visualizes source repositories using an interactive tree. Each disc represents a file, with a radius proportional to the number of lines of code (loc). All rendering is done client-side, in JavaScript. 

Built with d3.js and used by calling it in JQuery (reminds me of LUA though).
var myFlower = new CodeFlower("#visualization", 300, 200);

Read more: http://redotheweb.com/CodeFlower/

Subscribe to App Developer Magazine

Become a subscriber of App Developer Magazine for just $5.99 a month and take advantage of all these perks.


  • - Exclusive content from leaders in the industry
  • - Q&A articles from industry leaders
  • - Tips and tricks from the most successful developers weekly
  • - Monthly issues, including all 90+ back-issues since 2012
  • - Event discounts and early-bird signups
  • - Gain insight from top achievers in the app store
  • - Learn what tools to use, what SDK's to use, and more

    Subscribe here