はてなブログでのMarkdownでの数式の書き方とQiita、Kibelaとの比較
はてなブログのMarkdown形式で入力の記事に数式を入れる方法を確認しました。
大きく2つの方法がありそうです。
1つ目の公式のTeX記法は癖があり、私はやめました。公式のヘルプにも説明は1行しかないですし。
2つ目のMathJaxを手動で入れる方法を試しました。
1つ目の方法では、TeX記法中の ^, _, [, | などいくつかの記号も \ でエスケープしないといけないというブログ記事も複数ありました。これは面倒そうです。2つ目の方法であれば \\ 以外はエスケープしなくてもよさそうでした。
2020/05/19追記：はてなキーワードのリンクが発動されちゃって数式表示にならない問題がわかりました。やっぱり1つ目の方法に変えました。→ 次の記事
MathJax導入
全ページにMathJaxを入れる場合はブログの設定画面でヘッダに入れればよさそうですが、全ページに数式を使うわけではないですし、Markdownの中にも直接scriptタグを入れれるようなので、記事の中に直接入れることにしました。
以下のコードをMarkdownの先頭に書きます。
<script> MathJax = { tex: { displayMath: [["$$$$", "$$$$"]], inlineMath: [["$$", "$$"]] } }; </script> <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3.0.0/es5/tex-mml-chtml.js"></script>
前半の設定値はMathJaxの公式ドキュメントを参照。displayMathとinlineMathは好みです。私がこの設定にした理由は後述の通りKibelaとの互換性のためです。
TeX Input Processor Options — MathJax 3.0 documentation
例
$$$$
\begin{align}
e^{i\pi} &= -1 \\\\
z &= \left[ -\frac{1}{\tan(x+a)} \right]_{x=0}^{x=b} \\\\
A &= \begin{pmatrix}
a & b \\\\
c & d \\\\
\end{pmatrix}
\end{align}
$$$$
$$$$ \begin{align} e^{i\pi} &= -1 \\ z &= \left[ -\frac{1}{\tan(x+a)} \right]_{x=0}^{x=b} \\ A &= \begin{pmatrix} a & b \\ c & d \\ \end{pmatrix} \end{align} $$$$
文章中にインラインで数式を入れるには $$ e^{i\pi}=-1 $$ と書けば $$ e^{i\pi}=-1 $$ と表示されます。
数式中の改行は \\ ではなく \\\\ と書かないといけないです。
ほかのサービスとのTeX記法の比較
Qiita
ブロック
```math
e^{i\pi} = -1
```
インライン $e^{i\pi} = -1$
ブロック
```math
e^{i\pi} = -1
```
インライン $$e^{i\pi} = -1$$
または
インライン $`e^{i\pi} = -1`$
私のはてなブログでのdisplayMathとinlineMathはKibelaとの互換性を考えて上述の設定にしました。displayMathに ```math も設定したかったのですが、Markdownの記法と衝突するようで、使えませんでした。統一できなくて残念。
