Skip to content
Create a graphical representation of a collection of binary relationships (a graph).
Java Makefile
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Failed to load latest commit information.
doc Fix README. Sep 6, 2014
libs Setup for tests Sep 12, 2014
pictures Update README. Sep 6, 2014
tests Setup for tests Sep 13, 2014
.gitignore Fix Makefile May 31, 2016
LICENSE Initial release. Sep 2, 2013
Makefile Fix Makefile May 31, 2016 Highlight JSON example in README May 31, 2016
build.xml Add option to enable or disable smooth lines. Jul 20, 2014

Graph Illustrator

Graph Illustrator is program to draw graphs (as in Graph Theory) interactively, lightweight and easy to use.

Problems involving graphs are much more easy to understand with a graphical representation. I developed this tool mostly for my self, but I think it can be helpful to others too.


  • Draw edges and vertices using the mouse.
  • Custom colors for labels, background and borders.
  • Own JSON based file format to save your drawings.
  • Dragging of vertices using the mouse.
  • Export to SVG.
  • Zoom.
  • Other features.

SGI Format

Two formats are supported, GI (Graph Illustrator) and SGI (Simple Graph Illustrator), the latter is supported for convenience, many problems in competitive programming represent a graph in the form <from> <to> [weight], for example:

0 1 5
1 2 1
3 1 8
0 3 7
4 0 9

Save this in a file with extension .sgi and this is the result:


Vertices' positions are set randomly. For anything else use the GI format.

GI Format

This format uses JSON to represent the graph and all the necessary properties, is the recommended.

Example 0

Example 0

This is how a grah in GI format looks like:

    "Graph": {
        "Edges": [
                "backEdge": false,
                "center": {
                    "x": -2.29741,
                    "y": 1.666831
                "directed": true,
                "end": 2,
                "foregroundColor": "0x000000ff",
                "highlighted": false,
                "label": "from a to b",
                "start": 1,
                "strokeColor": "0x000000ff"
        "Vertices": [
                "backgroundColor": "0xffffffff",
                "borderColor": "0x000000ff",
                "center": {
                    "x": -10.31746,
                    "y": 1.211362
                "foregroundColor": "0x000000ff",
                "key": 1,
                "label": "a",
                "labelAlignment": "left",
                "radius": 1.428791
                "backgroundColor": "0xffffffff",
                "borderColor": "0x000000ff",
                "center": {
                    "x": 5.72264,
                    "y": 1.12782
                "foregroundColor": "0x000000ff",
                "key": 2,
                "label": "b",
                "labelAlignment": "left",
                "radius": 1.428791

Example 1

Example 1


Example 2

Example 2 Source

Example 3

Example 3 Source

Contributions and Bug reports

Contributions are welcome.

Bugs? For sure. Please report any bug you find, create an issue.

Something went wrong with that request. Please try again.