The Directed Acyclic Graph (DAG) is a concept I run into over-and-over again; which is, perhaps, somewhat ironic.

A DAG is a representation of vertices (nodes) that are connected by directional edges (arcs—i.e., lines) in such a way that there are no cycles (e.g., starting at Node A , you shouldn’t be able to return to Node A ).

DAGs have lots of uses in computer science problems and in discrete mathematics. You’ll find DAGs in build-systems, network problems, and, importantly (for this blog post, if not generally) in Git.

One way to think of a DAG is as a set of dependencies—each node may have a dependency on one or more other nodes. That is, in order to get to Node B you must route through Node A , so Node B depends on Node A :

The visualization of dependencies in a JSON object is (SURPRISE!) different from the input format needed to visualize a DAG using the D3.js Force layout. To change the above object into Force’s expected input, I created a little helper function:

forceFormat outputs a JSON object that can be used as input for the Force layout.

I can pass this resulting JSON object off to a function that I created after a long time staring at one of mbostock’s many amazing examples to create a D3 Force graph of verticies and edges:

You’d be forgiven for thinking that is a line.

This directional line is a DAG—albeit a simple one. Node B depends on Node A and that is the whole graph. If you want to get to Node B then you have to start at Node A . Depending on your problem-space, Node B could be many things: A place in Königsberg, a target in a Makefile (or a Rakefile), or (brace yourself) a Git object.