Obsidianとマークダウン記法を使い快適なメモ生活を！

※追記
imgタグで画像の表示ができなくなったので、詳しくは↓記事へ

https://qiita.com/Kei_Adachi/items/08741b2394e9747cafe7

面倒ですが埋め込みの<font color="red">\!\[](相対パス)</font>で代用してください。
WindowsのC:\Users\のような<font color="#ff0000">\を使うとPDF出力で画像が表示されなくなるので注意してください</font>
<br>

画像をドラッグ&ドロップする機能について、「画像をコピペやドラッグ&ドロップしたらassetsフォルダに自動的に保存されて表示される」と書きましたが、これは<font color="#ff0000">CustomAttachmentLocation</font>というプラグインの機能です。  
標準機能だと誤解し、誤った情報を記載してしまい申し訳ありませんでした。
このプラグインを有効化しない場合、assetsフォルダは作成されませんのでご注意ください。
<br>

## 目次
- [Obsidianのインストール](#Obsidianのインストール)
  - [インストール手順](##インストール手順)
    - [EditingToolbar](#EditingToolbar)
    - [Surfing](#Surfing)
- [マークダウン記法の紹介](#マークダウン記法の紹介)
  - [参考になるサイト](#参考になるサイト)
  - [見出し](#見出し)
  - [箇条書き](#箇条書き)
  - [強調](#強調)
  - [引用](#引用)
  - [コードブロック](#コードブロック)
  - [URLリンク](#URLリンク)
    - [Auto Link Titleプラグインについて](#Auto-Link-Titleプラグインについて)
    - [Obsidian URIを利用したリンクの作成](#Obsidian-URIを利用したリンクの作成)
  - [内部リンク](#内部リンク)
  - [埋め込み](#埋め込み)
  - [タスクリスト](#タスクリスト)
  - [ハイライト](#ハイライト)
  - [画像](#画像)
    - [imgタグの場合](#imgタグの場合)
    - [ドラッグ&ドロップした場合](#ドラッグ&ドロップした場合)
    - [CustomAttachmentLocation](#CustomAttachmentLocation)
  - [色を変える](#色を変える)
  - [表](#表)
  - [フローチャートや円グラフ](#フローチャートや円グラフ)
  - [インラインコード](#インラインコード)
  - [脚注](#脚注)
  - [打消し線](#打消し線)
  - [水平線](#水平線)
  - [数式](#数式)
  - [数式グラフ](#数式グラフ)
  - [mathメソッド](#mathメソッド)
  - [最後に](#最後に)
---


まず初めにマークダウンとObsidianについて少しだけ説明します。
マークダウン記法とはシンプルな書き方で文章を装飾し、文章構造を整えることができるものです。[^1]
<strong>記法</strong>とあるので、ある程度は記法を覚えておいた方が便利です。
ですが、<strong><span style="text-decoration: underline; text-decoration-color: red;">「記法覚えるとか面倒だからマークダウン使わなくて別にいいかなぁ...」</span></strong>と考えてページを閉じようとした方もしばしお待ちを！
Obsidianというソフトを使えば記法を覚えることなくマークダウンを自在に操ることができます！
しかもこのソフトはめちゃくちゃ便利なのに<strong><font color="red">無料で使うことができます。</font></strong>有料プランもありますが全然入らなくて大丈夫ですし、こういうソフトにありがちな<b><font color="red">有料プランへの切り替えを催促する有害広告</font></b>もありません。
また、多くのコミュニティプラグイン(この記事内のEditingToolbarやSurfingのこと)により、自分好みにカスタマイズできて非常に便利です！
便利なコミュニティプラグインについてまとめた記事2つなど、その他Obsidian関連の記事を書いてるので、そちらもぜひ覗いてみてください！
>[Obsidianをプラグインでもっと便利に！ #初心者 - Qiita](https://qiita.com/Kei_Adachi/items/1f5d01230334574f2e26)
>[Obsidianをプラグインでもっと便利に！！ #初心者向け - Qiita](https://qiita.com/Kei_Adachi/items/888e48405e064c8e1ac3)
>[ObsidianのCSSスニペットを使ってメモを見やすく！ #Markdown - Qiita](https://qiita.com/Kei_Adachi/items/d4fd3e0e2421575bf2a0)

<br>

- # Obsidianのインストール

<br>

- ## インストール手順

インストール手順と聞くと面倒なことやるのかぁと思うかもしれませんが、ほぼ<strong><font color="red">ダウンロードするだけ</font></strong>なのですぐ終わります。ご安心を。
まずは下記のリンクから自分が使っているOSを選びダウンロードしてください。
[Download - Obsidian](https://obsidian.md/download)

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/19a8cefc-c694-7991-5bb0-521a808810a0.png" width="70%">

インストールは現在のユーザーのみでもすべてのユーザーでもいいと思います。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/1de7c758-875b-e085-9fdf-804b229d1b11.png" width="70%">

忘れずに言語を日本語に指定しておきましょう。
保管庫がどうこうと出てくるので新規作成の方を選んでください。
保管庫はObsidianで作成したノート\(メモ)を保存するフォルダのことです。
Cドライブ直下とかドキュメントフォルダにobsidian_dataとか作ればいいと思います。お好きなフォルダに作りましょう。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/ccb22722-f72c-ce10-11c7-21a87da5853a.png" width="50%"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/9579a505-3c81-d885-c9fb-b32e348f8620.png" width="50%">

Obsidianが起動したら設定画面からコミュニティプラグインを有効化にしましょう。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/4f1ccf16-5db4-a33c-9011-07b48ff8002b.png" width="50%"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/2f3abd2b-7d89-b504-a9df-5387a21f9be9.png" width="50%">


今回はプラグイン紹介が主軸ではないので、2つだけインストールしてもらおうと思います。
プラグインはObsidianを使いやすくするための便利な機能であり、プラグインがなければObsidianを使う意味はないと言っても過言ではないと私は思っています。
<br>

- ### EditingToolbar
	最初にマークダウン記法を覚えなくていいと言ったのはこのプラグインがあるからです。
	Wordと同じようなツールバーが使えて、太字、下線、色などはもちろんURLリンクや表も簡単に挿入できるので<b><font color="red">Wordなどに慣れてるマークダウン記法初心者の方も安心です！</font></b>
	ツールバーを全部紹介していると冗長なので省きます。ぜひ使いながら便利さを実感してください！

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/7c5b7eee-ebad-2660-19ce-7ef7e5b1b120.png" width="100%">

コミュニティプラグインは設定画面から検索してインストールします。
よくあるミスとしてインストールしているのに有効化されていないケースがあるので忘れずに！
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/e109a6bf-8ff4-9155-b10d-6f6da388b871.png" width="50%"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/dddf952f-19bd-2dd5-3fed-d645a0b66a65.png" width="50%">
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/79012757-9199-3004-c0ab-c52fa9a7d52a.png" width="50%">
<br>

- ### Surfing
	Obsidianからネットサーフィンできるようになります。新規タブを開いてそのまま検索ワードを入力しましょう。この機能のおかげでChromeとかを別に立ち上げる必要がなくなるのでめちゃくちゃ便利です。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/a39395b3-bf7b-7820-cf77-a6190f6620ae.png" width="50%">

設定画面から使用するサーチエンジンを変更できます。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/2b51ce61-ef84-6834-3656-8f7e255d00fc.png" width="50%">

- # マークダウン記法の紹介
<br>

- ## 参考になるサイト

    他のサイトも参考にしてみるといいと思います。
    Obsidianの日本語ヘルプはかなり見やすくておすすめです。先に申し上げておきますが、この資料はObsidianの日本語ヘルプからの引用が結構な量あります。おとなしく日本語ヘルプ読んだ方がいいかもしれないです。
    >参考:
    >[ノートをフォーマットする - Obsidian 日本語ヘルプ - Obsidian Publish](https://publish.obsidian.md/help-ja/%E3%82%AC%E3%82%A4%E3%83%89/%E3%83%8E%E3%83%BC%E3%83%88%E3%82%92%E3%83%95%E3%82%A9%E3%83%BC%E3%83%9E%E3%83%83%E3%83%88%E3%81%99%E3%82%8B)
     [Qiita マークダウン記法 一覧表・チートシート](https://qiita.com/kamorits/items/6f342da395ad57468ae3)
     [Markdown記法 チートシート](http://qiita.com/Qiita/items/c686397e4a0f4f11683d)

    前置きが長くなってしまいました。マークダウン記法の紹介をしていきます。
<br>

- ## 見出し

```md
# 見出し1
## 見出し2
### 見出し3
#### 見出し4
##### 見出し5
###### 見出し6
```

# 見出し1
## 見出し2
### 見出し3
#### 見出し4
##### 見出し5
###### 見出し6

見出し1,2は下線がついていますがこれはQiitaの仕様だと思います。Obsidianではこのようにはなりません。
<br>

- ## 箇条書き

```md
- 箇条書きTabでインデント、Shift + Tabで左インデント
	- インデント

* これも箇条書き
	* インデント

1. 数字付きリスト
2. 2番目のリスト
3. 3番目のリスト

```

- 箇条書きTabでインデント、Shift + Tabで左インデント
	- インデント

* これも箇条書き
	* インデント

1. 数字付きリスト
2. 2番目のリスト
3. 3番目のリスト
<br>

- ## 強調

```md
**太字になります**
__これも太字__
*イタリック体になります*
_これもイタリック体_
```

**太字になります**
__これも太字__
*イタリック体になります*
_これもイタリック体_
<br>

- ## 引用

```md
> 引用
> 先頭に>を付けましょう。
> 引用した文をわかりやすくします。
```

> 引用
> 先頭に>を付けましょう。
> 引用した文をわかりやすくします。

>Obsidianはマークダウンエディタであり、ナレッジベースアプリでもあります。
>最も基本的な使い方としてマークダウンファイルの編集とプレビューを行うことができます。しかしながら、その真の力は密にネットワーク化されたナレッジベース管理によって発揮されます。[^2]
<br>

- ## コードブロック

```Python
\```Python
# code block
a = 10
b = 20
result = a + b 
print(f"a + b = {result}")
\```
```

※このままObsidianにコピペしても正しく表示されません。\を消してからコピペしてください。
\を置いとかないと表示がおかしくなるので仕方なく置いてるだけです。

\```のあとにPython、HTML、bash、MySQLなどを明示しておくと、コードを識別して色づけして表示してくれる。

>シンタックスハイライトは、最初のブラケットの後に言語を指定することでサポートされます。シンタックスハイライトにはprismjsを使用しており、サポートされている言語については[prismjsのサイト](https://prismjs.com/#supported-languages)で確認できます。[^2]



- ## URLリンク

```md
[ノートをフォーマットする - Obsidian 日本語ヘルプ - Obsidian Publish](https://publish.obsidian.md/help-ja/ガイド/ノートをフォーマットする)
```

[ノートをフォーマットする - Obsidian 日本語ヘルプ - Obsidian Publish](https://publish.obsidian.md/help-ja/ガイド/ノートをフォーマットする)
<br>

- #### Auto Link Titleプラグインについて

    Auto Link Titleというプラグインを入れると、URLコピーしてペースト時にタイトルを引っ張て来てURLリンクにしてくれます。
    便利ですが場合によっては鬱陶しいのでその時々によって無効化したりしましょう。ちょっとめんどい部分もあるので試しに使ってみてから考えてみてください。
<br>

- #### Obsidian URIを利用したリンクの作成

Obsidian URIと組み合わせることにより、作成したノート内に他のノートへのリンクを作成できる。
メモを取っているときに関連するメモのリンクを記載しておけば
「なんか関連のあるメモがあったのは覚えてるけど、どこに保存したっけなぁ......仕方ないし諦めるか......。」というようなよくある悲しい事故を防ぐことができます。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/24aa18cb-4c55-839b-9923-935b4a055fdc.png" width="70%">

このあと紹介する埋め込みや内部リンクの方が便利かも。
<br>

- ## 内部リンク

```md
[[おすすめツール]]
```

[[おすすめツール]]
内部リンクで作成したノートに飛べる。
Qiita上ではうまく表示できないのでObsidianでの表示をご覧ください。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/f10311f6-687a-72bf-624b-ba8e403054e4.png" width="50%">

<br>

- ## 埋め込み

```md
![[おすすめツール]]
```

公式サイトによると、埋め込みに対応しているフォーマットは以下のものです。
> Obsidianは現在、以下のファイルフォーマットを認識します。
> マークダウンファイル: md
> 画像ファイル: png, jpg, jpeg, gif, bmp, svg
> 音声ファイル: mp3, webm, wav, m4a, ogg, 3gp, flac
> 動画ファイル: mp4, webm, ogv
> PDFファイル: pdf
> すべてのファイルをノートに埋め込むことができます。

https://publish.obsidian.md/help-ja/%E9%AB%98%E5%BA%A6%E3%81%AA%E3%83%88%E3%83%94%E3%83%83%E3%82%AF/%E5%88%A9%E7%94%A8%E5%8F%AF%E8%83%BD%E3%81%AA%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%83%95%E3%82%A9%E3%83%BC%E3%83%9E%E3%83%83%E3%83%88

Obsidianで作成したノート内に別のファイルを埋め込むことができる。
![[おすすめツール]]
先程同様Obsidianでの表示をご覧ください。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/11db08e8-3abb-7fd9-dff3-534e0e7ad0d0.png" width="50%">

<br>

- ## タスクリスト

```md
- [x] #タグ,  [リンク]() の**フォーマット**をサポートしています。
- [x] 必要なリスト構文（順序なしリストまたは順序付きリストがサポートされています）
- [x] これは完了したアイテムです。
- [?] これも同様に完了したアイテムです(あらゆる文字で機能します)。
- [ ] これは未完了のアイテムです。
- [ ] タスクはプレビューモードでクリックするとチェックオフできます。
```

- [x] [#タグ、](https://publish.obsidian.md/#%E3%82%BF%E3%82%B0%E3%80%81)[リンク](https://publish.obsidian.md/#) の**フォーマット**をサポートしています。
- [x] 必要なリスト構文（順序なしリストまたは順序付きリストがサポートされています）
- [x] これは完了したアイテムです。
- [x] これも同様に完了したアイテムです(あらゆる文字で機能します)。
- [ ] これは未完了のアイテムです。
- [ ] タスクはプレビューモードでクリックするとチェックを外せます。[^2]
<br>

- ## ハイライト

```md
二つのイコール記号を使うと==テキストをハイライト==できます。
```

二つのイコール記号を使うと==テキストをハイライト==できます。[^2]

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/d5e0422c-f58a-994d-7813-6707d6c4940a.png" width="70%">

Editing Toolbarでハイライトの色を変えることもできます。
<br>

- ## 画像

#### ~~imgタグの場合~~

```HTML
<img src="表示したい画像のパス">
```
2025年3月前半辺りからノート内の画像が表示されず、誤動作かなにかだと考えていましたが、<b><font color="red">imgタグでの画像表示が出来なくなっているようです。</font></b>
私以外にも同様の事象が発生している点や公式サイトにHTMLサニタイズとあるのでアップデートによるものか......

https://help.obsidian.md/Editing+and+formatting/HTML+content

HTMLサニタイズのページって前からありましたか？知ってる方いれば教えてください！
ちなみにですが、画像のパスが`https://`から始まるものは表示されるし、使えるHTMLタグもありました。公式サイトさらっと見回しても言及がありませんでした。静的なHTMLなら動くと勝手に予想してます。

なので画像の表示は
```
![犬1.jpg|200](res/Picture/Obsidianチュートリアル/犬1.jpg)
```
で行いましょう。`[]`の中は何でもいいです。`|200`のようにピクセル数を指定します。
注意事項として、Windowsユーザーはディレクトリをコピペすると<font color="FF0000">`\`区切りになりますが、`/`に変更しましょう。</font>
`\`のままだとPDF出力した際に画像が表示されなくなりますので`Ctrl+H`で置換しましょう。imgタグを丸ごと置換するプログラムを作って記事にしたので、詳しくは↓を参考にしてください。

https://qiita.com/Kei_Adachi/items/08741b2394e9747cafe7

.mdファイルでは表示されるのに、PDF出力されるのトラップすぎる......
↓こんな感じ
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/02242e21-db83-4bdf-92a7-385a8eac9192.png" width="70%">

<br>

#### ドラッグ&ドロップした場合

```md
![[ドラッグ&ドロップした画像のファイル名|ピクセル数]]
```

![[雑多メモ/assets/Obsidianとマークダウン記法を使い快適なメモ生活を！/柴犬2.jpg|170]]
![[雑多メモ/assets/Obsidianとマークダウン記法を使い快適なメモ生活を！/柴犬4.jpg|170]]

先程同様Obsidianでの表示をご覧ください。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/2ffcd3d0-5266-80f7-3ee5-787caab314cb.png" width="50%">


~~imgタグを詰めて書くと右隣に画像を表示できる。~~
~~ドラッグ&ドロップの場合はなぜか右隣に表示できず、改行してしまいます。~~

![[雑多メモ/assets/Obsidianとマークダウン記法を使い快適なメモ生活を！/柴犬4.jpg|50%]]
<br>

#### CustomAttachmentLocation
このプラグインを入れるとドラッグ&ドロップした写真を自動的にassetsフォルダに置いてくれます。
ドラッグ&ドロップしたらassetsフォルダも自動的に作られます。
もちろんドラッグ&ドロップしたら勝手に表示されるので、気にしなきゃいけないのはサイズぐらいですね。

<br>

- ## 色を変える

```HTML
<font color="LightGreen">LightGreen</font>
```

<font color="LightGreen">LightGreen</font>

もう御察しだと思いますがHTMLタグ使えるので色々便利です。
HTMLがわからなくてもEditing Toolbarから使えるのでご心配なく。
参考になりそうなリンクも貼っておきます。
>参考: 
[Qiita用 Obsidian コマンド【文字色の変更】](https://qiita.com/kohki_takatama/items/f9df251d66c71780a8dd)
> [Qiitaのマークダウンで色をつける方法140色](https://qiita.com/twipg/items/d8043cd4681a2780c160)
<br>

- ## 表

```md

|                                   Wikipedia |                      note |
| ------------------------------------------: | ------------------------: |
| [Wikipedia](https://ja.wikipedia.org/wiki/) | [note](https://note.com/) |

```

|                                   Wikipedia |                      note |
| ------------------------------------------: | ------------------------: |
| [Wikipedia](https://ja.wikipedia.org/wiki/) | [note](https://note.com/) |

EditingToolbarの表の部分をクリックすれば作れます。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/f13ef789-2b10-b5ff-952a-d229559de2b4.png" width="50%">


列をドラッグ&ドロップで入れ替えたり

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/f6c76987-df8e-2b35-b88c-7f7ffa6f0985.png" width="50%"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/f67ec538-5791-8327-7248-30438cffc84e.png" width="50%"><img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/000c8e50-0bd8-fb02-ccb2-90c98eb10a3e.png" width="50%">

列の部分で右クリックすると左揃え、中央揃え、右揃えなどが使えます。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/82d1ce7e-9d86-4a57-f296-f27f53d20b76.png" width="50%">

\<br>で改行できます。表内でShift+enterを押すことでも改行できます。
enterで行を追加します。

右側に `:`を置けば右揃えになり、左側に `:`を置けば左揃えになります。両端に `:`を置けば中央揃えになります。
手動でやるより右クリックの方が楽なので覚える必要はないですね。
<br>

- ## フローチャートや円グラフ

Mermaidというプラグインをインストールすると、グラフ、フローチャートなどが書けて便利です。
```mermaid
graph TD
A-->B
A-->C
B-->D
C-->D
```

```
\```mermaid
graph TD
A-->B
A-->C
B-->D
C-->D
\```
```
ER図などの色々な図をテキストで書ける

※このままObsidianにコピペしても正しく表示されません。\を消してからコピペしてください。
\を置いとかないと表示がおかしくなるので仕方なく置いてるだけです。


```mermaid
classDiagram
class 商品情報{
商品ID-goods_id
商品名-goods_name
価格-goods_price
}

class 注文明細{
注文ID-order_id
明細ID-particulars_id
商品ID-goods_id
注文数-order_num
}

graph TD
商品情報-->注文明細
```

```
\```mermaid
classDiagram
class 商品情報{
商品ID-goods_id
商品名-goods_name
価格-goods_price
}

class 注文明細{
注文ID-order_id
明細ID-particulars_id
商品ID-goods_id
注文数-order_num
}

graph TD
商品情報-->注文明細

\```
```

棒グラフや円グラフもテキストで書ける

```mermaid
xychart-beta
        title "売上高"
        x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
        y-axis "Revenue (in $)" 4000 --> 11000
        bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
        line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
```

```
\```mermaid
xychart-beta
        title "Sales Revenue"
        x-axis [jan, feb, mar, apr, may, jun, jul, aug, sep, oct, nov, dec]
        y-axis "Revenue (in $)" 4000 --> 11000
        bar [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
        line [5000, 6000, 7500, 8200, 9500, 10500, 11000, 10200, 9200, 8500, 7000, 6000]
\```
```

```mermaid
pie title きのこたけのこ百年戦争
        "たけのこ" : 85
        "きのこ" : 14
        "ヤンヤンつけボー" : 1
```

```
\```mermaid
pie title きのこたけのこ百年戦争
        "たけのこ" : 85
        "きのこ" : 14
        "ヤンヤンつけボー" : 1
\```
```

mermaidのツールバーから簡単に使うことができます。

<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/25549480-b991-a4de-8d79-785d5563e6d6.png" width="40%">
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/9a2f4ed8-f308-4bc5-a133-8cf2ed3eb8a6.png" width="40%">

>参考:[フローチャート](https://qiita.com/duora0406/items/fce45aeb0bb9c726e14a)
<br>

- ## インラインコード

```md
行において`ブラケット`に囲まれたテキストはコードのようにフォーマットされます。
```

行において `ブラケット` に囲まれたテキストはコードのようにフォーマットされます。[^2]
<br>

- ## 脚注

```md
脚注[^2]
```

脚注[^2]

>参考:[Obsidianプラグイン（Footnotes）｜まご｜馬郡明弘](https://note.com/usa2023/n/nac287fe34c5f)
<br>

- ## 打消し線

```md
~~打消し線~~
```

~~打消し線~~
<br>

- ## 水平線

```md
水平線

---
これも水平線
***
```

<br>

水平線

---
これも水平線
***

\---の直前の行に文字がある場合は間に空行を入れないと水平線が表示されません。

- ## 数式
    \$\$で囲んだものはLaTeXとして解釈され表示されます。
    私はLaTexへの理解がものすごく浅いので「数式きれいに表示できる便利なやつ」という認識です\()
    理系の人が論文執筆時によく使う組版処理システムらしいです。気になる方はググってみてください。

```LaTeX
$$
\int tan x dx = -\log \vert {\cos x} \vert + C
$$
```

$$
\int tan x dx = -\log \vert {\cos x} \vert + C
$$

インテグラル、三角関数、対数関数、指数関数もテキストベースで綺麗に書けるので便利です。
<br>

>参考:
>[LaTexについての解説](https://hwb.ecc.u-tokyo.ac.jp/wp/applications-2/latex/math/)
>[LaTeX - Wikipedia](https://ja.wikipedia.org/wiki/LaTeX)
<br>

- ## 数式グラフ

コミュニティプラグインからdesmosgraphをインストールすることで三角関数とか指数対数のグラフを描くことができます。

```desmos-graph
\```desmos-graph
left=-30; right=30;
top=3; bottom=-3;
---
y = \frac{\sin(x)}{x}
\```
```

※このままObsidianにコピペしても正しく表示されません。\を消してからコピペしてください。
\を置いとかないと表示がおかしくなるので仕方なく置いてるだけです。

先程同様(ry
Obsidanの写真置いときますね。
<img src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/3c93641a-6aa7-1933-3cd5-52bb83fc897b.png" width="50%">



>参考:[desmos-graphの使い方](https://wineroses.hatenablog.com/entry/2024/02/15/104509)
<br>

- ## mathメソッド

Dataviewというプラグインをインストールして「Enable Inline Javascript Queries」をONにするとjsのMath関数が使えて簡易的な電卓が使えます。[^3]
Dataviewはここで紹介しきれないくらい便利なプラグインなので他のサイトなどを参考にしてみてください！

>参考:
>[【Obsidian】dataviewの使い方｜六](https://note.com/6kuga0/n/n228824aec14e)
>[ObsidianのDataviewの使い方 入門 | えいじのサイバー備忘録](https://eiji.page/blog/obsidian-dataview-howto/)

```
`$= Math.sqrt(5)`
```

`$= Math.sqrt(5)`

先程同様(ry
Obsidanの写真置いときますね。
![mathメソッド.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3853726/033cb326-0420-cd94-aa5b-f1ee21cbc471.png)

<br>

- ## 最後に
以上になります。なにか修正すべき点や間違いを発見したらお知らせお願いします。
初めて書いた記事なので自信はないですが、そういったコメントがとてもありがたいので遠慮なくお願いします！記事に対する感想や御意見もあれば嬉しいです！ここまでお付き合いいただきありがとうございました！
以下は引用させていただいたサイトのリンクです。

[^1]:[マークダウン記法とは何か？具体的な書き方と例文＋チートシートをまとめました](https://lp.flouu.work/media/_PS1Vvff)
[^2]: [ノートをフォーマットする - Obsidian 日本語ヘルプ - Obsidian Publish](https://publish.obsidian.md/help-ja/%E3%82%AC%E3%82%A4%E3%83%89/%E3%83%8E%E3%83%BC%E3%83%88%E3%82%92%E3%83%95%E3%82%A9%E3%83%BC%E3%83%9E%E3%83%83%E3%83%88%E3%81%99%E3%82%8B)
[^3]:[Obsidianを簡易電卓として使う方法 - Jazzと読書の日々](https://wineroses.hatenablog.com/entry/2023/05/13/191901)