Magic Spell
Generated Diagram
Preparing all the things...
Magic Spell
Generated Diagram
Your charts will be saved in your browser, so they should be here the next time (unless you clear your browser's cache).
Your charts will be saved in your browser, so they should be here the next time (unless you clear your browser's cache).
Your charts are saved in your browser. If you clear your browser's cache, they will be lost.
Are you sure you want to delete ?
Rename as:
Chart Mage is a tool for drawing sequence diagrams and flowcharts based on a simple syntax, in a similar manner as markdown.
Chart Mage was created by Junlin Shang.
Many thanks to the cool projects mermaid, Codemirror, Underscore, node-uuid, jQuery Modal, base16. Chart Mage was made possible by them.
If you have any thought about Chart Mage, feel free to contact me.
The chart you asked for is missing. This is probably caused by clearance of browser's localStorage.
Please refresh the page to continue.
((Enclosing text with double parenthesis))
Just type the text
Would you please leave a question mark at the end?
->>
- some text ->>
-->>
-- some text -->>
subgraph title
graph definition
end
You don't have to include the participant lines. But by doing so you can explicitly specify the actor's order of appearance.
participant Alice
[Actor][Arrow][Actor]: Message Text
->>
-->>
-x
--x
Alice ->>+ John: Activate
John -->>- Alice: Dedicated
loop Loop Title
Alice ->> John: How you doing?
John -->> Alice: Fine. How you doing?
end
Alice->>John: Hello John, how are you?
alt is sick
John->>Alice: Not so good :(
else is well
John->>Alice: Feeling fresh like a daisy
end
opt Extra response
John->>Alice: Thanks for asking
end
You can add notes by the notation:
Note [ right of | left of | over ] [Actor]: Text in note content
Note right of John: Text in note
You can also create notes spanning two participants:
Note over Alice, John: Text in note