Control-flow graph visualization for VS Code.
This extension adds a Graph Overview to VS Code, showing the CFG (control-flow graph) for the current function.
Install via the extension page at the VSCode Marketplace.
You can try it out via an interactive demo if you don't want to install it.
Note that the demo only supports a single function and ignores the cursor location.
Both dark, light, and custom color schemes are supported.
Dark | Light | Custom |
---|---|---|
By default, the color scheme will match the VSCode theme (light or dark).
You can change to a different preset via the settings:
Custom color schems are created via the interactive demo.
- Enable the
Color Picker
above the graph - Select the colors you want for your color scheme
- Press the
Copy
button to copy the color scheme into the clipboard - Paste the config into the
Custom Color Scheme
field in the VSCode extension settings.
- Bun is required to develop the project.
- Bun for Visual Studio Code is needed for debugging in VS Code
- emscripted is only required if you want to add new tree-sitter parsers.
Clone the project and install dependencies.
git clone https://github.com/tmr232/function-graph-overview/
cd function-graph-overview
bun install
You can debug the extension via VS Code by pressing F5.
To run the demo, run bun demo
.