Help:Mermaid: Difference between revisions
(→Links) |
|||
| (23 intermediate revisions by the same user not shown) | |||
| Line 2: | Line 2: | ||
== Examples == | == Examples == | ||
=== graph with links === | |||
{{#mermaid:graph TD; | |||
A[Secretary of Agriculture] | |||
B[ Under Secretary for<br/> Farm Production<br/> and Conservation] | |||
C[ Under Secretary for<br/> Food, Nutrition<br/> and Consumer Services] | |||
D[ Under Secretary for<br/> Food Safety] | |||
E[ Under Secretary for<br/> Marketing and<br/> Regulatory Programs] | |||
F[ Under Secretary for<br/> Natural Resources<br/> and Environment] | |||
G[ Under Secretary for<br/> Rural Development] | |||
H[ Under Secretary for<br/> Research, Education<br/> and Economics] | |||
I[ Under Secretary for<br/> Trade and Foreign<br/> Agricultural Affairs] | |||
A-->B; | |||
A-->C; | |||
A-->D; | |||
A-->E; | |||
A-->F; | |||
A-->G; | |||
A-->H; | |||
A-->I; | |||
click A "https://openusaproject.com/wiki/Secretary_of_Agriculture" | |||
click B "https://openusaproject.com/wiki/Under_Secretary_for_Farm_Production_and_Conservation" | |||
click C "https://sandbox.semantic-mediawiki.org/wiki/C" | |||
click D "https://sandbox.semantic-mediawiki.org/wiki/D" | |||
style A fill:#ffffff,color:blue | |||
classDef node font-size:20px,color:#000; | |||
class A,B,C,D,E,F,G,H,I node | |||
}} | |||
=== Test=== | |||
{{#mermaid:graph TD; | |||
flowchart TB | |||
subgraph CEO | |||
A[CEO] | |||
end | |||
subgraph Departments | |||
B[Finance] --> A | |||
C[Marketing] --> A | |||
D[IT] --> A | |||
E[HR] --> A | |||
F[Operations] --> A | |||
end | |||
}} | |||
===Sequence=== | ===Sequence=== | ||
{{#mermaid:sequenceDiagram | {{#mermaid:sequenceDiagram | ||
| Line 32: | Line 74: | ||
Create tests for renderer :2d | Create tests for renderer :2d | ||
Add to mermaid :1d | Add to mermaid :1d | ||
}} | |||
=== graph with links === | |||
{{#mermaid:graph TD; | |||
A-->B; | |||
A-->C; | |||
B-->D; | |||
C-->D; | |||
click A "https://sandbox.semantic-mediawiki.org/wiki/A" | |||
click B "https://sandbox.semantic-mediawiki.org/wiki/B" | |||
click C "https://sandbox.semantic-mediawiki.org/wiki/C" | |||
click D "https://sandbox.semantic-mediawiki.org/wiki/D" | |||
}} | }} | ||
| Line 46: | Line 100: | ||
*http://pro.wiki/ | *http://pro.wiki/ | ||
*https://www.pro.wiki/help/draw-mermaid-diagrams-charts-in-mediawiki | *https://www.pro.wiki/help/draw-mermaid-diagrams-charts-in-mediawiki | ||
*https://github.com/SemanticMediaWiki/Mermaid | |||
*https://www.semantic-mediawiki.org/wiki/Help:Using_Mermaid_together_with_Semantic_MediaWiki | |||
*https://www.youtube.com/watch?v=XgETf5w5i-U | |||
*https://mermaid.js.org/syntax/entityRelationshipDiagram.html | |||
Latest revision as of 21:55, 7 December 2024
The Mermaid extension provides a parser function to help generate diagrams and flowcharts using the mermaid script language. See the README file for detailed instructions on how to install, configure and use this extension
Examples
graph with links
Test
Sequence
Syntax
graph with links
Links
- https://www.mediawiki.org/wiki/Extension:Mermaid
- https://mermaid.js.org/syntax/stateDiagram.html
- https://www.mediawiki.org/wiki/Extension_talk:Mermaid
- https://github.com/SemanticMediaWiki/Mermaid
- https://www.semantic-mediawiki.org/wiki/Help:Using_Mermaid_together_with_Semantic_MediaWiki
- http://readme.md/
- http://usage.md/
- http://sandbox.semantic-mediawiki.org/
- http://pro.wiki/
- https://www.pro.wiki/help/draw-mermaid-diagrams-charts-in-mediawiki
- https://github.com/SemanticMediaWiki/Mermaid
- https://www.semantic-mediawiki.org/wiki/Help:Using_Mermaid_together_with_Semantic_MediaWiki
- https://www.youtube.com/watch?v=XgETf5w5i-U
- https://mermaid.js.org/syntax/entityRelationshipDiagram.html