Mermaidを使って円グラフを書こう。

Mermaidで円グラフを書いてみよう

Mermaidについては以下の記事を参照ください。

今回はMermaidを使って円グラフを書いてみます。

シーケンス図はある動作に対する処理の流れを記載したものです。

以下のサンプルをもとに説明していきます。

    ```mermaid
    pie title 飼育しているペット
        "犬" : 63.8
        "猫" : 28.1
        "魚" : 13.3
    ```

    ```mermaid

まずは、「ここからMermaidを書くぞ」の記載です。
これはMarkdownのコードを書く書式と同じで、コード名を「mermaid」とするだけです。

    pie title 飼育しているペット

次に「Mermaid」の中の「pie」だと指定します。
そのまま「title」に続けて円グラフのタイトルを定義します。

        "犬" : 63.8
        "猫" : 28.1
        "魚" : 13.3

では、本体部分です。

円グラフの場合は小難しいことはありません。

ダブルコーテーション（”）で囲った項目に続けてコロン（:）で区切り、値を記載するだけです。

円グラフは実はこれだけです。
実際もう少しだけ定義があるのと、更新されているかもしれないので、ページ最後のURLをチェックしてみてください。

ちなみに、最後は閉じるのを忘れないように。

```

さらに詳しく円グラフの書き方を確認したい場合は公式をあわせて参照してください。

こんなのが書きたい！というのがあればコメントを頂ければ追記しますのでぜひコメントまで。