
JS Sequence Diagrams – UML Sequence Diagram in SVG from Text - mathiasrw
http://bramp.github.io/js-sequence-diagrams/
======
octygen
When I was at Disney back in 2011, we used this daily for a year:
[https://www.websequencediagrams.com/](https://www.websequencediagrams.com/)

If you have a good tech architect running a meeting this tool is great to
create sequence flows on the fly. It's also got great builtin features like
exporting and an API for integration.

Last but not least, it has the Rational Rose theme @haddr mentioned but my
personal favorite is boring ol' Blue Modern

------
tobych
Is this the same syntax that PlantUML uses?
[http://plantuml.com/sequence.html](http://plantuml.com/sequence.html)

~~~
josteink
It seems similar to
[http://www.websequencediagrams.com](http://www.websequencediagrams.com),
which plantuml was modelled after.

And that has a million integrations available, including a pretty good emacs-
module[1] ;)

[1] [https://github.com/josteink/wsd-mode](https://github.com/josteink/wsd-
mode)

------
mahmoudimus
I am a big big fan of [http://www.gravizo.com/](http://www.gravizo.com/) as
well. It's amazing.

------
gohrt
Related:
[https://en.wikipedia.org/wiki/MscGen](https://en.wikipedia.org/wiki/MscGen)

------
rmanalan
This lib isn't new. Glad to see it here on HN. I remember building a simple
editor for it on jsbin a few years ago:

[http://output.jsbin.com/ebahuh](http://output.jsbin.com/ebahuh)

------
espadrine
This reminds me a lot of
[https://github.com/tpatel/OpenSequenceDiagrams.js](https://github.com/tpatel/OpenSequenceDiagrams.js),
which was designed to be collaborative (eg,
[https://thefiletree.com/demo/diagram.sequence](https://thefiletree.com/demo/diagram.sequence)).

It seems way more streamlined, produces more beautiful results, and probably
could be made collaborative as well.

Edit: I made a realtime collaborative plug, here is an example:
[https://thefiletree.com/espadrine/sequence.sequence](https://thefiletree.com/espadrine/sequence.sequence)

However, the syntax is not as extended, it seems.

------
gregmac
Neat.

Threw together a usermacro for Atlassian Confluence that uses this as a quick
and dirty proof of concept:
[https://gist.github.com/gregmac/fa89a3d86dcb1a008153](https://gist.github.com/gregmac/fa89a3d86dcb1a008153)

------
fsiefken
This look similar to mermaid diagrams, but mermaid seems more complete

------
baconner
Hey these are great. Anyone know of one that will produce a playable animation
through the sequence?

------
sharpercoder
I prefer fast & simple SVG over "hand-drawn-generated" SVG. Does your
generation support this? I noticed a lot of DOM junk in the current generated
graphs.

------
kevindeasis
This is really cool and looks fun. Ive been trying to find something like in
the past. Ive been using software to do uml and it just wasnt fun.

------
DanielBMarkham
Very cool. Would love to see this for class diagrams.

------
jamies888888
Impressive! Any reason you chose Raphael over D3?

------
livoras
State diagram will be useful.

