前端绘图:Js-Sequence-Diagrams使用及入门
作用:
将简单的文本行绘制成手绘风(或是简单的直线条)的流程图。优点是不需要复杂的数据结构。一个简单的javascript库将文本转换成矢量UML时序图,轻量化简单自有空间巨大,全面实现ultradebug网站编辑自有。
演示:
Simple代码:(防止被解析加了数字1,实际中[seq1][/seq1]把1删了)
[AppleScript] 纯文本查看 复制代码 [seq1=simple]China-->Andrew: How are you?
Andrew->>China: I am good thanks![/seq1] SyntaxHighlighter Copyright 2004-2013 Alex Gorbatchev.
Hand代码:(防止被解析加了数字1,实际中[seq1][/seq1]把1删了)
[AppleScript] 纯文本查看 复制代码 [seq1=hand]China-->Andrew: How are you?
Andrew->>China: I am good thanks![/seq1] SyntaxHighlighter Copyright 2004-2013 Alex Gorbatchev.
Simple代码:(防止被解析加了数字1,实际中[seq1][/seq1]把1删了)
[AppleScript] 纯文本查看 复制代码 [seq1=simple]Title: Here is a title
A->B: Normal line
B-->C: Dashed line
C->>D: Open arrow
D-->>A: Dashed open arrow[/seq1] SyntaxHighlighter Copyright 2004-2013 Alex Gorbatchev.
Hand代码:(防止被解析加了数字1,实际中[seq1][/seq1]把1删了)
[AppleScript] 纯文本查看 复制代码 [seq1=hand]Title: Here is a title
A->B: Normal line
B-->C: Dashed line
C->>D: Open arrow
D-->>A: Dashed open arrow[/seq1] SyntaxHighlighter Copyright 2004-2013 Alex Gorbatchev.
Simple代码:(防止被解析加了数字1,实际中[seq1][/seq1]把1删了)
[AppleScript] 纯文本查看 复制代码 [seq1=simple]participant C
participant B
participant A
Note right of A: By listing the participants\n you can change their order[/seq1] SyntaxHighlighter Copyright 2004-2013 Alex Gorbatchev.
Hand代码:(防止被解析加了数字1,实际中[seq1][/seq1]把1删了)
[AppleScript] 纯文本查看 复制代码 [seq1=hand]participant C
participant B
participant A
Note right of A: By listing the participants\n you can change their order[/seq1] SyntaxHighlighter Copyright 2004-2013 Alex Gorbatchev.
|