便利ツール

Mermaidを使って図表作成もObsidianで!

  • メモをObsidianでしている
  • 簡単な図表を作りたいことがある
悩める女性

今回の内容

  • Obsidianってなに?
  • Mermaidを使うと出来ること
  • インストール方法
  • 使い方
  • まとめ

Obsidianってなに?

そもそもObsidianってなに?って方はこちらの記事をご覧ください。

Obsidianの魅力からインストール方法、簡単な使い方までを解説しています。

Mermaidを使うと出来ること

Obsidian上で簡単に図表を作成して埋め込むことができます。

詳しい使い方は以下をご覧ください。

ここではObsidianは文字だけのメモじゃなくこんなことも出来るよ!ということを知ってもらうために簡単に説明します。

インストール方法

実はObsidianでは標準でMermaidを利用することができます!

特にインストールや有効化は必要ないので普段通り新規ノートを作成してください!

使い方

作図というとマウスをポチポチして細かい調整をして...とめんどくさいイメージがあると思います。

しかし、Mermaidはその必要はなく、全てテキストで記述することで綺麗な図を生成してくれます。

書き方こそ覚える必要がありますが、慣れてしまえばマウスを用いて作図を行うより圧倒的に早く、綺麗な図を作成することができます。

```mermaid
グラフの種類
表示内容
...
```

が基本の形です。

これだけでは分からないと思うので以下に例を示します。

基本的に公式サイトから抜粋させていただいたものです。

まずは、円グラフの例です

```mermaid
	pie title 1週間の曜日の比率
	"月": 1
	"火": 1
	"水": 1
	"木": 1
	"金": 1
	"土": 1
	"日": 1
```
円グラフの例

このようにpie title タイトル に続いて内容を書いていくことで、簡単に円グラフを作ることができます。

次に、フローチャートの例です

```mermaid
    graph TD
        A-->B
	A-->C
	B-->D
	C-->D
```
フローチャートの例

このように、繋ぎたい要素を--> で指定するだけで簡単に矢印で繋ぐことができます。

この他にも、ダイアグラムやガントチャート、クラス図、gitのグラフなど様々な図を簡単に作図し、埋め込むことができます。

詳しくはこちらをご覧ください。

まとめ

簡単ですが、Obsidian上で作図を行うことができる"Mermaid"というツールの紹介でした。

文字だけの場合よりも後から思い出す際の手助けになったり、人に説明する際にも分かりやすかったりと、図を活用するメリットは多数あると思います。

みなさんもぜひMermainとObsidianの力を掛け合わせて学習を加速させてください!

  • この記事を書いた人

でんでん

23歳 | 新卒プログラマー | リモートワーカー
誰でも分かりやすくITで生活を豊かに出来る記事を目指しています

-便利ツール
-,