喵哥代肝

原神 星铁 全职代肝

Test：图表

发表于 分类于 ，
本文字数： 1.7k 阅读时长 ≈ 3 分钟
语法和插件等项目测试

Test:图表

flowchart#

Plugin: https://github.com/bubkoo/hexo-filter-flowchart

生成流程图。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
\`\`\`flow
st=>start: Start|past:>http://www.google.com[blank]
e=>end: End:>http://www.google.com
op1=>operation: My Operation|past
op2=>operation: Stuff|current
sub1=>subroutine: My Subroutine|invalid
cond=>condition: Yes
or No?|approved:>http://www.google.com
c2=>condition: Good idea|rejected
io=>inputoutput: catch something...|request

st->op1(right)->cond
cond(yes, right)->c2
cond(no)->sub1(left)->op1
c2(yes)->io->e
c2(no)->op2->e
\`\`\`

sequence#

Plugin: https://github.com/bubkoo/hexo-filter-sequence

生成UML序列图。

1
2
3
4
5
\`\`\`sequence
Alice->Bob: Hello Bob, how are you?
Note right of Bob: Bob thinks
Bob-->Alice: I am good thanks!
\`\`\`

主题标签#

Next> Mermaid#

Next> Mermaid-doc

从文本生成图表和流程图

1
2
3
{% mermaid type %}
... ...
{% endmermaid %}

流程图#

doc

从上到下

1
2
3
{% mermaid graph TB %}
    Start --> Stop
{% endmermaid %}
            graph TB
            Start --> Stop

从左到右

1
2
3
{% mermaid graph LR %}
    Start --> Stop
{% endmermaid %}
            graph LR
            Start --> Stop

顺序图#

doc

1
2
3
4
{% mermaid sequenceDiagram %}
    Alice->>John: Hello John, how are you?
    John-->>Alice: Great!
{% endmermaid %}
            sequenceDiagram
            Alice->>John: Hello John, how are you?
John-->>Alice: Great!

类图#

doc

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
{% mermaid classDiagram %}
      Animal <|-- Duck
      Animal <|-- Fish
      Animal <|-- Zebra
      Animal : +int age
      Animal : +String gender
      Animal: +isMammal()
      Animal: +mate()
      class Duck{
          +String beakColor
          +swim()
          +quack()
      }
      class Fish{
          -int sizeInFeet
          -canEat()
      }
      class Zebra{
          +bool is_wild
          +run()
      }
{% endmermaid %}
            classDiagram
            Animal <|-- Duck
Animal <|-- Fish
Animal <|-- Zebra
Animal : +int age
Animal : +String gender
Animal: +isMammal()
Animal: +mate()
class Duck{
    +String beakColor
    +swim()
    +quack()
}
class Fish{
    -int sizeInFeet
    -canEat()
}
class Zebra{
    +bool is_wild
    +run()
}

状态图#

doc

1
2
3
4
5
6
7
{% mermaid stateDiagram-v2 %}
    [*] --> First
    state First {
        [*] --> second
        second --> [*]
    }
{% endmermaid %}
            stateDiagram-v2
            [*] --> First
state First {
    [*] --> second
    second --> [*]
}

甘特图#

doc

1
2
3
4
5
6
7
8
9
10
{% mermaid gantt %}
    title A Gantt Diagram
    dateFormat  YYYY-MM-DD
    section Section
    A task           :a1, 2014-01-01, 30d
    Another task     :after a1  , 20d
    section Another
    Task in sec      :2014-01-12  , 12d
    another task     : 24d
{% endmermaid %}
            gantt
            title A Gantt Diagram
dateFormat  YYYY-MM-DD
section Section
A task           :a1, 2014-01-01, 30d
Another task     :after a1  , 20d
section Another
Task in sec      :2014-01-12  , 12d
another task     : 24d

饼形图#

doc

1
2
3
4
5
{% mermaid pie title Pets adopted by volunteers %}
    "Dogs" : 386
    "Cats" : 85
    "Rats" : 15 
{% endmermaid %}
            pie title Pets adopted by volunteers
            "Dogs" : 386
"Cats" : 85
"Rats" : 15

参考阅读#

相关文章