GoCity: Turn your Golang program into a 3D city

2 min read

A team from Federal University of Minas Gerais (UFMG) created a Code City metaphor for visualizing Golang source code called GoCity. You simply paste the IRL to a GitHub repository and GoCity plots it out as a city with districts and buildings. It allows you to visualize your code as a neat three-dimensional city.

GoCity represents a program written in Go as a city:

The folders are represented as districts
Files in the program are shown as buildings of varying heights, shapes, and sizes
The structs are represented as buildings stacked on the top of their files

Characteristics of the structures

The Number of Lines of Source Code (LOC) represents the building color. Higher values make the building dark.
The Number of Variables (NOV) in the program affects the building’s base size.
The Number of methods (NOM) in the program affects the height of the.

The UI/front-end

The UI for GoCIty is built with React and uses babylon.js to plot the 3D structures. The source code for the front-end is available in the front-end branch on GitHub.

What the users are saying

A comment on Hacker news by user napsterbr reads: “Cool! Interestingly I always use a similar metaphor on my own projects. For instance, the event system may be seen as the roads linking different blocks (domains), each with their own building (module).”

The Kubernetes repository does seem to take a toll as it forms a lot of buildings spaced out. “The granddaddy of them all, Kubernetes, takes quite a toll performance-wise. https://go-city.github.io/#/github.com/kubernetes/kubernetes.”

But like another user jackwilsdon pointed out on Reddit: “Try github.com/golang/go if you want some real browser-hanging action!”

For more details, visit the GitHub repository. For an interactive live demonstration, visit the Go City website.