MathJaxを使ってwebページに数式を表現

解説

ページ内の任意の場所に、

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/latest.js?config=TeX-MML-AM_CHTML"></script>
と記述すれば、tex風に書いた部分が自動で数式に変換される。

MathJax本体をここからダウンロードすることもできるが、大量のpngファイルを含む。そのため、自分の環境に用意するようなことは考えず、素直に外部URLを使ったほうがよさそう。
https://github.com/mathjax/MathJax

2021/10/31 追記
pngファイルは古いブラウザー用なので削除しても問題ないことがわかった。MathJaxバージョン2を解凍して、fonts/HTML-CSS/TeX/pngをフォルダーごと削除することで7MB程度軽くできる。
MathJaxのバージョン2は解凍してサーバー上に配置するだけなのでお手軽。解凍後のサイズはpngを除いて60MB程度。

使用例

\(\sum_{n=1}^\infty \frac{1}{n^2} = \frac{\pi^2}{6}\)
\(\sum_{n=1}^\infty \frac{1}{n^2} = \frac{\pi^2}{6}\)

\[
  {\rm softmax}(x)_{i} := \cfrac{e^{x_i}}{\sum_{j=1}^n e^{x_j}}
  \tag{1.1}
\]
\[ {\rm softmax}(x)_{i} := \cfrac{e^{x_i}}{\sum_{j=1}^n e^{x_j}} \tag{1.1} \]

\begin{align}
  \int_{-\infty}^a x*p_N(x|\mu, \sigma^2) dx &= \int_{-\infty}^a \cfrac{x-\mu+\mu}{\sqrt{2\pi\sigma^2}}{\rm exp}\left(-\frac{(x-\mu)^2}{2\sigma^2}\right) dx \\
  &= \int_{-\infty}^{\frac{a-\mu}{\sqrt{2\sigma^2}}} \cfrac{\sqrt{2\sigma^2} t+\mu}{\sqrt{\pi}}{\rm exp}\left(-t^2\right) dt \\
  &= -\sqrt{\cfrac{\sigma^2}{2\pi}}{\rm exp}\left(-\frac{(a-\mu)^2}{2\sigma^2}\right) + \frac{\mu}{2}\left({\rm erf}\left(\frac{a-\mu}{\sqrt{2\sigma^2}}\right)+1\right) \\
  &= -\sigma^2p_N(a|\mu, \sigma^2) + \frac{\mu}{2}\left({\rm erf}\left(\frac{a-\mu}{\sqrt{2\sigma^2}}\right)+1\right)
\end{align}
\begin{align} \int_{-\infty}^a x*p_N(x|\mu, \sigma^2) dx &= \int_{-\infty}^a \cfrac{x-\mu+\mu}{\sqrt{2\pi\sigma^2}}{\rm exp}\left(-\frac{(x-\mu)^2}{2\sigma^2}\right) dx \\ &= \int_{-\infty}^{\frac{a-\mu}{\sqrt{2\sigma^2}}} \cfrac{\sqrt{2\sigma^2} t+\mu}{\sqrt{\pi}}{\rm exp}\left(-t^2\right) dt \\ &= -\sqrt{\cfrac{\sigma^2}{2\pi}}{\rm exp}\left(-\frac{(a-\mu)^2}{2\sigma^2}\right) + \frac{\mu}{2}\left({\rm erf}\left(\frac{a-\mu}{\sqrt{2\sigma^2}}\right)+1\right) \\ &= -\sigma^2p_N(a|\mu, \sigma^2) + \frac{\mu}{2}\left({\rm erf}\left(\frac{a-\mu}{\sqrt{2\sigma^2}}\right)+1\right) \end{align}