Introduction


Some years ago my colleague Alistair Jones created a neat little tool named Arrows to create, edit and render example graphs in a consistent way.

Because it also stores the positions of nodes, it always sticks to the same layout and doesn’t wiggle around.

arrows

The User Interface is minimal:

  • create new nodes with (+ Node)

  • drag relationships out of the halo of a node

  • either to an empty space for a new node or centered over an existing one to connect them

  • double click nodes and relationships to edit them, set names and properties (in a `key: "value" syntax)

  • there are two styles, the chunky largish one and a more polished Bootstrap style

  • you can show the Markdown and also replace it with a previously saved fragment

  • you can export to SVG or take a screenshot

  • you can export to Cypher and also open the graph in a Neo4j Console

Arrows Tool


Resources


We mostly use it for presentations, but also to show data models for Neo4j GraphGists and Neo4j Browser Guides like this one.

You can find the hosted version here: http://www.apcjones.com/arrows

The tool is open source and the renderer and editor and a self-hosted variant are available in this GitHub repository.

Arrows has its internal graph model and API that you can also control programmatically.

It uses HTML-Markdown with a bunch of attributes as data storage for your graph data, you can export and import Markdown in that format, It’s also stored in browser storage.

I recorded a quick video of Arrows in Action. Enjoy!