2019년 2월 1일 금요일

[Markdown] Mermaid Examples


1. Mermaid Flowchart (1)

1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="script/mermaid.css" />
<script src="script/mermaid.min.js"></script>
</head>
<body>
<div class="mermaid">
graph TD
A[Christmas] -->|Get money| B(Go shopping)
B --> C{Let me think}
C -->|One| D[Laptop]
C ==>|Two| E["iPhone #9829;"]
D --- E
C -.->|Three| F[fa:fa-car Car]
F -. Loop .-> B
</div>
</body>
</html>


Output:



2. Mermaid Flowchart (1)


1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/mermaid/7.0.0/mermaid.css" rel="stylesheet"/>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/mermaid/7.0.0/mermaid.js"></script>
</head>
<body>
    <div class="mermaid">
        graph LR
            A-->B
            B-->C
            C-->A
            D-->C
    </div>
</body>
</html>


Output:





on
라벨:

댓글 없음:

댓글 쓰기

피드 구독하기: 댓글 (Atom)