Visualizing JS source code as a metaphorical City in 3D

6 views
Skip to first unread message

DrQ

unread,
Nov 6, 2016, 1:12:31 PM11/6/16
to Performance Visualization
"JSCity is an implementation of the Code City metaphor for visualizing source code. We adapted and implemented this metaphor for JavaScript, using the three.js 3D library. JSCity represents a JavaScript program as a city; folders are districts and files are sub-districts; the buildings are functions; inner functions are represented as buildings on the top of their nested function/building. The Number Of Lines of Source (LOC) represents the height of the buildings/functions; the Number Of Variables (NOV) in a function correlates to the building's base size. Blue buildings denote named functions; green buildings are anonymous functions."



Reply all
Reply to author
Forward
0 new messages