|
|
| Line 1: |
Line 1: |
| When initially rendered, this graph will fit the width of the window, scaling down if necessary:
| | {{#invoke:Chart|chart|width=400|height=100|xAxisTitle=X|yAxisTitle=Y |
| {{#mermaid:graph LR; | | |legend=Legend|type=stackedarea|x=1,2,3,4,5,6|y1=10,12,6,14,2,10 |
| A["This is a very wide box"]
| | |y2=2,4,6,8,13,11|interpolate=monotone|colors=seagreen,orchid}} |
| B["This is a very wide box"]
| |
| C["This is a very wide box"]
| |
| D["This is a very wide box"]
| |
| E["This is a very wide box"]
| |
| F["This is a very wide box"]
| |
| G["This is a very wide box"]
| |
| H["This is a very wide box"]
| |
| I["This is a very wide box"]
| |
| J["This is a very wide box"]
| |
| A-->B
| |
| B-->C
| |
| C-->D
| |
| D-->E
| |
| E-->F
| |
| F-->G
| |
| G-->H
| |
| H-->I
| |
| I-->J
| |
| }}
| |
| | |
| | |
| | |
| When [https://github.com/SemanticMediaWiki/Mermaid/pull/41 pull request 41] is applied, this graph will render at the default size regardless of whether it is wider than the window, and it will scroll horizontally necessary:
| |
| {{#mermaid:graph LR;
| |
| A["This is a very wide box"]
| |
| B["This is a very wide box"]
| |
| C["This is a very wide box"]
| |
| D["This is a very wide box"]
| |
| E["This is a very wide box"]
| |
| F["This is a very wide box"]
| |
| G["This is a very wide box"]
| |
| H["This is a very wide box"]
| |
| I["This is a very wide box"]
| |
| J["This is a very wide box"]
| |
| A-->B
| |
| B-->C
| |
| C-->D
| |
| D-->E
| |
| E-->F
| |
| F-->G
| |
| G-->H
| |
| H-->I
| |
| I-->J
| |
| | | |
| config.flowchart.useMaxWidth = false
| |
| }} | |
