The repogram is a generative visualization of the re|thread repo.
The data is extracted and analyzed with the data/tree_extraction.py script, and stored in the data/repo_data.json file.
To create or update the JSON file, run py tree_extraction.py in the data folder. Python needs to be installed.
There are two visualizations. They represent the same data, with the same logic (an animated breadth-first search) but in different shapes. They are web-based, created with p5.js.
In both cases, the order of the directories and files is shuffled (recursively), so that the visualization changes each time the page is loaded: it's generative!
In the rectangular version, each directory or file is drawn as one rectangle. All leaves have the same width. Otherwise, the width of a node is the sum of the widths of its children, and the width of the root directory (at the very top) is the width of the visualization. The heights are computed so that the graph fills the whole image vertically, as all leaves reach the bottom.
Live view: https://rethread.art/code/repogram/rectangular.
lines: whether we also draw the white tree lines on top (yesorno, default isno)width: the width of the image (default is the width of the browser window)height: the height of the image (default is the height of the browser window)
- In the circular version, the data is represented as a circular tree, with the root at its center and leaves on the border.
Live view: https://rethread.art/code/repogram/circular.
background: the color of the background (white,blackortransparent, default isblack)color: whether the lines are multicolored or not (yesorno, default isyes)width: the width of the image (default is the width of the browser window)height: the height of the image (default is the height of the browser window)
