Is anyone aware of a pure, Javascript based implementation of the directional flow diagrams that GraphViz is capable of generating? I am NOT interested in pretty visuals output, but the computations to figure out the maximum depth of each node, along with the layout of bezier lines that are optimized to minimize the number of intersecting edges when you are dealing with a graph rather than a tree of information. I would like to run this code both within a browser; I am aware that I could easily embed Graphviz into my Node server as an extension, or even popen()
it and stream over graph information in the .dot
format.
For reference, here is a typical GraphViz output. Note how elements are stacked and spaced out to allow the connecting lines to travel between nodes, without intersecting (very often) or passing through nodes.
Take a look at this pure JavaScript implementation of a .dot canvas renderer:
The library is not documented -- the author definitely ought to publicize and document it more (I'll contact him to suggest he put it up on github, at the very least).
Update: code has been pushed to github: https://github.com/gyuque/livizjs
Update (14/2/2013): another contender has arisen! anybody interested in the subject should definitely take a look at Viz.js's example page and github repo.
Update (7/16/2020): (seven years later) http://webgraphviz.com/ is also great! :-)