LoginSignup
2
3

More than 3 years have passed since last update.

GitHub Pagesで数式を書く方法と主なトラブルについて

Posted at

はじめに

GitHub Pagesを利用すればmarkdownファイルを静的なwebページとして公開することができます。(その際mdファイルはhtmlファイルに変換されます)
ですがそのままではmarkdownに数式を書くことができないので、ここではMathJaxを使ってTeX記法で数式を記述する方法に説明します。
また、実際にやってみてプレビューでは正しく表示されるにもかかわらずGitHub Pagesでは表示がおかしい箇所もあったため解決できた点については対処法も記載します。

準備

markdownファイル内に以下の記述を追加します

<script type="text/x-mathjax-config">MathJax.Hub.Config({tex2jax:{inlineMath:[['\$','\$'],['\\(','\\)']],processEscapes:true},CommonHTML: {matchFontHeight:false}});</script>
<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_CHTML"></script>

これでMathJaxを使う準備ができました。あとは\$\sqrt{2}\$のようにTeX記法で数式を書くことができます。
amsmathパッケージなどにも対応しているようです。

GitHub Pagesで数式を使う際のトラブル

必ず発生するわけではありませんが、ローカル(VSCodeの拡張機能など)では正しくプレビューできたのにGitHub Pagesでは表示がおかしくなるパターンがありました。
ここではそれらの原因となりうる記述および回避法について記載します。

絶対値

普段であれば絶対値の記号には|を使うと思いますが、表の区切りと誤認識されることがあります。

対処法

かわりに\lvert(左側) \rvert(右側)コマンドを使うことで回避可能です。

下付き文字

アンダーバーで囲むと<em>タグによる強調になるため、これも誤認識のきっかけになることがあります。残念ながらコマンドの回避はおそらく無理です。

対処法

アンダーバーの前後に半角スペースを1つずつ空けることで回避可能です。下付き文字のためであれば1つ空白が入っていても問題なく表示されます。

微分のダッシュ

f''などと書いた際にダッシュではなくアポストロフィが表示されることがあります。
2階微分以上でよく見る気がしますが1個だけのときもたまに発生します。

対処法

\primeコマンドを使うことで回避できます。2階微分などでは\prime\primeのように連続で書いてOKです。

\\での改行

使う場面としては行列を書く場合などです。基本的には\\と書けば改行されますが、たまにエスケープのミスでバックスラッシュ1個と解釈されることがあります。

対処法

強引ですが\\\\とすれば一応回避可能です。上記までのトラブルと異なり、もともとちゃんと表示されていた箇所でこれをやるとデザインが崩れるためあくまで誤エスケープ対策です。

おわりに

現時点で見つけたトラブルは以上です。今後も色々な数式を書く上で新たな不具合が発生するかもしれないのでその際は(できれば解決法と併せて)追記したいと思います。

2
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
3