カテゴリー
リンク

図書や雑誌のリンク

インプレスブックス

カテゴリー
マークダウン リンク

markdownに関するリンク集

mermaid

  1. A basic mermaid User-Guide for Beginners

  2. ガントチャート描画詳細

  3. Mermaid Live Editor

  4. MermaidCLI

  5. Mermaid Webpack Demo

  6. Mermaid Parcel Demo

  7. stackedit community

  8. mermaid syntax

flowchart

  1. flowchart syntax
カテゴリー
濾胞性リンパ腫闘病記録

濾胞性リンパ腫関連資料

入院時に病院から頂いた資料

  1. 濾胞性リンパ腫観察研究のお願い.pdf
  2. ガザイバハンドブック2020.pdf
  3. がん薬物療法を受ける方へ.pdf
  4. ガザイバ維持療法費用.pdf
カテゴリー
マークダウン

flowサンプル

フローチャート

st=>start: 開始
op1=>operation: 処理1
op2=>operation: 処理2
cd1=>condition: 条件分岐1
cd2=>condition: 条件分岐2
sb1=>subroutine: サブルーチン
io1=>inputoutput: 出力
e=>end: 終了

st->cd1
cd1(yes)->op1->sb1->cd2
cd1(no)->sb1->cd2
cd2(yes)->io1
cd2(no)->op2->io1
io1->e

ソース

``` flow
st=>start: 開始
op1=>operation: 処理1
op2=>operation: 処理2
cd1=>condition: 条件分岐1
cd2=>condition: 条件分岐2
sb1=>subroutine: サブルーチン
io1=>inputoutput: 出力
e=>end: 終了
st->cd1
cd1(yes)->op1->sb1->cd2
cd1(no)->sb1->cd2
cd2(yes)->io1
cd2(no)->op2->io1
io1->e

テーブル

A B

ソース

| A | B |
|---|---|
|1|2|
|3|4|
カテゴリー
マークダウン

Markdown -mermaidサンプル

WordPressのmarkdownプラグイン"MD Githuber MD"を使い図形描画できる。
・画像出力ではないため、PDF変換した際に図形内の文字を検索できる点が嬉しい。


sequenceDiagram


sequenceDiagram
    participant Alice
    participant Bob
    Alice->>John: Hello John, how are you?
    loop Healthcheck
        John->>John: Fight against hypochondria
    end
    Note right of John: Rational thoughts <br/>prevail!
    John-->>Alice: Great!
    John->>Bob: How about you?
    Bob-->>John: Jolly good!

gantt

gantt
dateFormat  MM/DD
title Adding GANTT diagram to mermaid
section A section
Completed task:done,des1,10/06,10/08
Active task:active,des2, 10/09, 3d
Future task:des3,after des2,5d
Future task2:des4,after des3,5d
gantt
title schedule(休日祝日なし設定)
    dateFormat YYYY-MM-DD
    axisFormat  %m/%d
    excludes weekends 2020-04-29  2020-05-02 2020-05-03 2020-05-04 2020-05-05 2020-05-06 2020-07-23 2020-07-24 2020-08-10 2020-09-21 2020-09-22 2020-11-03 2020-11-23

    section HTML
        設計&開発ドキュメント作成: design_and_doc, 2020-04-13, 3d

    section Migration
        設計: desgin_migration, after design_and_doc, 2d
        実装: imple_migration, after imple_api, 5d

    section REST API
        設計: design_api, after desgin_migration, 5d
        実装: imple_api, after design_api, 5d
        テスト: test_api, after imple_api, 5d

    section Android
        実装: imple_android, after test_api, 2w

    section iOS
        実装: imple_ios, after imple_android, 2w

classDiagram

classDiagram
Class01 <|-- AveryLongClass : Cool
Class03 *-- Class04
Class05 o-- Class06
Class07 .. Class08
Class09 --> C2 : Where am i?
Class09 --* C3
Class09 --|> Class07
Class07 : equals()
Class07 : Object[] elementData
Class01 : size()
Class01 : int chimp
Class01 : int gorilla
Class08 <--> C2: Cool label

gitGraph:

gitGraph:
options
{
    "nodeSpacing": 150,
    "nodeRadius": 10
}
end
commit
branch newbranch
checkout newbranch
commit
commit
checkout master
commit
commit
merge newbranch

erDiagram

erDiagram
    CUSTOMER ||--o{ ORDER : places
    ORDER ||--|{ LINE-ITEM : contains
    CUSTOMER }|..|{ DELIVERY-ADDRESS : uses

journey

journey
    title My working day
    section Go to work
      Make tea: 5: Me
      Go upstairs: 3: Me
      Do work: 1: Me, Cat
    section Go home
      Go downstairs: 5: Me
      Sit down: 5: Me

piechart

pie
    title Key elements in Product X
    "Calcium" : 42.96
    "Potassium" : 50.05
    "Magnesium" : 10.01
    "Iron" :  5

graph LR

graph LR
    id1[(Database)]
id2(This is the text in the box)
id3([This is the text in the box])
id4[[This is the text in the box]]
id5((This is the text in the circle))
id6>This is the text in the box]
id7{This is the text in the box}
id8{{This is the text in the box}}
id9[/This is the text in the box/]
id10[\This is the text in the box\]
A[/"Christmas:#9829;"\]
B[\"Go shopping:#quot;"/]
C --> D --- E -- text --- F
G -.-> H ==> I
J --> K & L --> M

id99(Start)-->id98(Stop)
    style id98 fill:#f9f,stroke:#333,stroke-width:4px
    style id99 fill:#bbf,stroke:#f66,stroke-width:2px,color:#fff,stroke-dasharray: 5 5

XX:::someclass --> YY
    classDef someclass fill:#f96;

flowchart LR

flowchart LR
O --o P --x R
A o--o B
B <--> C
C x--x D
flowchart LR
c1-->a2
subgraph one
    a1-->a2
end
subgraph two
    b1-->b2
end
subgraph three
    c1-->c2
end
one --> two
three --> two
two --> c2