Workflow (i.e. Directed Graph) Browser Based Editors

Question

I want to provide a WYSIWYG tool, preferably JavaScript based, for workflow diagramming (i.e. directed graphs). I need commercial software friendly licensing, which can include paying a fee to OEM. If there's a necessary server side piece I'd need it in Java or ColdFusion because I'm integrating with an existing product.

My workflow graphs can have more than one start vertex, but only one end vertex, and edges are directed. Beyond WYSIWYG editing, I'm looking for a tool that can assist with the following:

1. Ability to export the drawing so it can be:
   1. persisted
   2. parsed by a programming language (I'm assuming XML, but other formats are just fine).
   3. edited again (preserving layout information)
2. Associate arbitrary data with edges and vertices including ability to define view/edit panes.

Nice to have:

1. Detection if any vertices are unable to reach the end.
2. Automatically layout vertices and edges if no plotting information is provided.

I've looked at mxGraph, which seems promising, but am hoping an answerer here can provide some additional direction before I jump down the rabbit hole.

Answer 1

Have you checked out the JavaScript InfoVis Toolkit yet (http://thejit.org/)? It might not have everything you need, but it does force-directed graph layouts, and allows interactive editing. Since it's rendering into a JavaScript canvas, you should be able to save the results as an image file.

Here are some demos of the graph-layout functionality: http://thejit.org/static/v20/Jit/Examples/ForceDirected/example2.html

Answer 2

Try Oryx and share your experiences. Features

1. open source
2. web based as well as desktop
3. java script based UI with plugins. since its just java sccript, I am assuming you can embed it.
4. supports export/import to/from BPMN 2.0
5. supports embeddable view i.e. provides mashup api

---

NOTE: Please share your experiences as I am on the same boat as you. we can help each other. I am also tagging this question with "oryx" so that all the experiences can be aggregated into this tag