MathJax

Beautiful math in all browsers

\[ \frac{1}{\pi} = \frac{2\sqrt{2}}{9801} \sum_{k=0}^\infty \frac{(4k)!(1103*26390k)}{k!^4 396^{4k}} \]

\[x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}\] \[x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}\]

概要


本家


関連サイト



導入

CDN 利用の方が一般的。末尾に、MathJax.js?config=TeX-AMS-MML_SVG&locale=ja と、ロケールを追加すると、数式上で右クリックしたときに出てくるメニューが日本語化する。

CDN (Content Delivery Network)

HTML+CSS 出力
SVG画像 出力

Combined Configurations — MathJax 2.6 documentation

行の中に数式を入れるときは、"\(" "\)" で囲んで、TeX数式記述。独立した行で数式を表示したい場合は、"\[" "\]" で囲む。TeX数式をTeX記述のまま表示したい場合は code タグで囲む。

\[ \begin{align} f(x) & = (a+b)^2 \\ & = a^2+2ab+b^2 \\ \end{align} \]

\[ \begin{align} f(x) & = (a+b)^2 \\ & = a^2+2ab+b^2 \\ \end{align} \]

Tips


取り消し線

  • \require{cancel} を記述すると、取り消し線が使えるようになる。

\[ \require{cancel} M = \cancel{m} r (\frac{2 \pi}{T})^2 \frac{r^2}{G \cancel{m}} = \frac{4 \pi^2 r^3}{GT^2} \]

ブラウザ下部の「Typesetting math」表示の禁止


\[\]を中央寄せじゃなく左寄せにする

JavaScript で MathJax.Hub.Config 中のプロパテイを上書きする。他にも色々設定できるみたいだが、あまり試してない。The Core Configuration Options — MathJax 2.6 documentation

或いは、以下のクラスに、CSSを指定する。important! は必須。


レンダリング終了後のプログラム起動

MathJax の処理は MathJax.Hub.Queue に溜められ、順次実行される。なので、キューに処理を追加すれば、レンダリング終了後、最後に実行される。

レンダリング終了後に、透明Canvas を被せて描画するサンプル。


\[ \begin{pmatrix} a_{00} & a_{01} & a_{02} & a_{03} \\ a_{10} & a_{11} & a_{12} & a_{13} \\ a_{20} & a_{21} & a_{22} & a_{23} \\ a_{30} & a_{31} & a_{32} & a_{33} \end{pmatrix} \]


JavaScript出力のレンダリング

JavaScript で、TeX形式の数式を生成して表示する場合、数式生成後にHTMLに Idエレメントで表示し、以下のプログラムのように書いて、MathJax.jsでのレンダリングを指定する。

Modifying Math on the Page — MathJax 2.4 documentation


SVG 形式で出力してる時の数式に色を指定する

Changing SVG color · mathjax/MathJax-docs Wiki · GitHub


数式のフォントに部分的に色を付ける方法

数式中の該当箇所に、"\color[RGB]{255,0,0}" "\color[rgb]{0,0.3,0.8}" のように色指定する。元に戻す場合は、元の色を指定する。下の左端の青い色をクリックして、色の変更ができます。

色指定: \[ a + \color[RGB]{0,0,255} bc \color[rgb]{0,0,0} + d \] a+\color[RGB]{0,0,255}bc\color[RGB]{0,0,0}+d
\color[RGB]{0,0,255}
            
色指定: \[ a + \color[rgb]{0,0,1} bc \color[rgb]{0,0,0} + d \] a+\color[rgb]{0,0,1}bc\color[rgb]{0,0,0}+d
\color[rgb]{0,0,1}
            

個人的によく使う表記

数式の要素を順にTeX記述すれば、それなりにレンダリングしてくれる。式中のスペースは無視される。"^" 上付小文字 (\(x^3\))、"_" 下付き小文字 (\(a_{ij}\)) は拡大解釈され、\(\sum_{i=0}^\infty\) や \(\int_0^\infty\) の上下の数字にも適用される。上付下付や、\(\sqrt 2\) などの直後1文字は操作が適用されるが、2文字以上を表記したい場合は、"{}" を使って明示的にグループ化する。"\(\)" のインライン表示では、上下切り詰めの表示になる。


文字


アクセント記号・分音記号

ピンインの記述もできる。

\(\acute{a}\)\acute{a} \(\grave{a}\)\grave{a} \(\hat{a}\)\hat{a} \(\tilde{a}\)\tilde{a} \(\breve{a}\)\breve{a}
\(\check{a}\)\check{a} \(\bar{a}\)\bar{a} \(\ddot{a}\)\ddot{a} \(\dot{a}\)\dot{a} \(\mathbf{A}\)\mathbf{A}

導関数

\prime は ' でもOK。

\(\nabla\)\nabla \(\partial\)\partial \(\frac{d}{dx}f(x)\)\frac{d}{dx}f(x) \(f^{\prime\prime}\)f^{\prime\prime}

累積

\[\sum_{i=a}^b\]\sum_a^b \[\int_a^b\]\int_a^b \[\prod_{i=a}^N x_i\]\prod_{i=a}^N x_i \[\lim_{n \to \infty}x_n\]\lim_{n \to \infty}x_n

集合・述語論理

\(\forall\)\forall \(\exists\)\exitsts \(\varnothing\)\varnothing \(\in\)\in \(\ni\)\ni \(\notin\)\notin \(\not \ni\)\not \ni
\(\subset\)\subset \(\subseteq\)\subseteq \(\supset\)\supset \(\supseteq\)\supseteq \(\cap\)\cap \(\cup\)\cup

二項演算子

\(\pm\)\pm \(\mp\)\mp \(\times\)\times \(\cdot\)\cdot \(\bullet\)\bullet
\(\star\)\star \(\div\)\div \(\frac{a}{b}\)\frac{a}{b}

論理演算子

\(\land\)\land \(\lor\)\lor \(\lnot\)\lnot \(\bar{p}\)\bar{p} \(\to\)\to

平方根

\(\sqrt{2}\)\sqrt{2} \(\sqrt[3]{2}\)\sqrt[3]{2} \(\sqrt[n]{x}\)\sqrt[n]{x}

関係演算子

「<」「>」 はそのまま記述。

\(\sim\)\sim \(\simeq\)\simeq \(\cong\)\cong \(\approx\)\approx \(\dot=\)\dot=
\(\leqq\)\leqq \(\le\)\le \(\ll\)\ll \(\gg\)\gg \(\ge\)\ge \(\geqq\)\geqq
\(\equiv\)\equiv \(\not\equiv\)\not\equiv \(\ne\)\ne \(\propto\)\propto

幾何学記号

\(\triangle\)\triangle \(\angle\)\angle \(\perp\)\perp \(45^\circ\)45^\circ

矢印

斜め矢印は、頭に ne (North East) などの方角で指定。

\(\leftarrow\)\leftarrow \(\gets\)\gets \(\rightarrow\)\rightarrow \(\to\)\to \(\leftrightarrow\)\leftrightarrow
\(\Leftarrow\)\Leftarrow \(\Rightarrow\)\Rightarrow \(\Leftrightarrow\)\Leftrightarrow
\(\longleftarrow\)\longleftarrow \(\longrightarrow\)\longrightarrow \(\longleftrightarrow\)\longleftrightarrow
\(\Longleftarrow\)\Longleftarrow \(\Longrightarrow\)\Longrightarrow \(\Longleftrightarrow\)\Longleftrightarrow
\(\uparrow\)\uparrow \(\downarrow\)\downarrow \(\updownarrow\)\updownarrow \(\Uparrow\)\Uparrow \(\Downarrow\)\Downarrow \(\Updownarrow\)\Updownarrow
\(\nearrow\)\nearrow \(\searrow\)\searrow \(\swarrow\)\swarrow \(\nwarrow\)\nwarrow \(\mapsto\)\mapsto \(\longmapsto\)\longmapsto

特殊記号

\(\And\)\And \(\ldots\)\ldots \(\cdots\)\cdots \(\infty\)\infty \(\imath\)\imath \(\hbar\)\hbar
\(\diamondsuit\)\diamondsuit \(\heartsuit\)\heartsuit \(\clubsuit\)\clubsuit \(\spadesuit\)\spadesuit \(\flat\)\flat \(\natural\)\natural \(\sharp\)\sharp

ギリシャ文字

\(\Gamma\)\Gamma \(\Delta\)\Delta \(\Theta\)\Theta \(\Lambda\)\Lambda \(\Xi\)\Xi \(\Pi\)\Pi
\(\Sigma\)\Sigma \(\Upsilon\)\Upsilon \(\Phi\)\Phi \(\Psi\)\Psi \(\Omega\)\Omega
\(\alpha\)\alpha \(\beta\)\beta \(\gamma\)\gamma \(\delta\)\delta \(\epsilon\)\epsilon \(\zeta\)\zeta
\(\eta\)\eta \(\theta\)\theta \(\iota\)\iota \(\kappa\)\kappa \(\lambda\)\lambda \(\mu\)\mu
\(\nu\)\nu \(\xi\)\xi \(\omicron\)\omicron \(\pi\)\pi \(\rho\)\rho \(\sigma\)\sigma
\(\tau\)\tau \(\upsilon\)\upsilon \(\phi\)\phi \(\chi\)\chi \(\psi\)\psi \(\omega\)\omega

空白

\(a\qquad b\)\qquad \(a\quad b\)\quad \(a\ b\)\ \(a\,b\)\,

定形

大括弧 \[ \left ( \frac{a}{b} \right ) \]
\left ( \frac{a}{b} \right )
              
総和 \[ \sum_{k=1}^N k^2 \]
\sum_{k=1}^N k^2
              
総積 \[ \prod_{i=1}^N x_i \]
\prod_{i=1}^N x_i
              
極限 \[ \lim_{n \to \infty}x_n \]
\lim_{n \to \infty}x_n
              
積分 \[ \int\limits_{1}^{3}\frac{e^3/x}{x^2}\, dx \]
\int\limits_{1}^{3}\frac{e^3/x}{x^2}\, dx
              
解の公式 \[ x=\frac{-b\pm\sqrt{b^2-4ac}}{2a} \]
\frac{-b\pm\sqrt{b^2-4ac}}{2a}
              
連分数 \[ \frac{4}{\pi} = 1 + \frac{1^2}{2+\frac{3^2}{2+\frac{\cdots}{2 + \frac{(2n-1)^2}{2+\cdots}}}} \]
\frac{4}{\pi} = 1 + \frac{1^2}{2+\frac{3^2}
{2+\frac{\cdots}{2 + \frac{(2n-1)^2}{2+\cdots}}}}
              
ラマヌジャン \[ \frac{1}{\pi} = \frac{2\sqrt{2}}{9801} \sum_{k=0}^\infty \frac{(4k)!(1103+26390k)}{k!^4 396^{4k}} \]
\frac{1}{\pi} = \frac{2\sqrt{2}}{9801}
 \sum_{k=0}^\infty \frac{(4k)!(1103*26390k)}{k!^4 396^{4k}}
              
マクローリン \[ f(x) = \sum_{n=1}^\infty \frac{f^{(n)}(0)}{n!} x^n \]
f(x) = \sum_{n=1}^\infty \frac{f^{(n)}(0)}{n!} x^n
              
sin \[ \sin x = x - \frac{x^3}{3!} + \frac{x^5}{5!} - \cdots + (-1)^n \frac{x^{2n+1}}{(2n+1)!} + \cdots \]
\sin x = x - \frac{x^3}{3!} + \frac{x^5}{5!}
- \cdots + (-1)^n \frac{x^{2n+1}}{(2n+1)!} + \cdots
              
加法定理 \[ \cos(\alpha \pm \beta) = \cos\alpha \cos\beta \mp \sin\alpha \sin\beta \]
\cos(\alpha \pm \beta) = \cos\alpha \cos\beta \mp \sin\alpha \sin\beta
              
行列 2x2 \[ A = \begin{pmatrix} 1 & 2 \\ 3 & 4 \end{pmatrix} \]
\begin{pmatrix}
1 & 2 \\
3 & 4
\end{pmatrix}
              
行列 3x3 \[ A = \begin{pmatrix} 1 & 2 & 3 \\ 4 & 5 & 6 \\ 7 & 8 & 9 \end{pmatrix} \]
\begin{pmatrix}
1 & 2 & 3 \\
4 & 5 & 6 \\
7 & 8 & 9
\end{pmatrix}
              
行列 4x4 \[ A = \begin{pmatrix} 1 & 2 & 3 & 4 \\ 5 & 6 & 7 & 8 \\ 9 & 10 & 11 & 12 \\ 13 & 14 & 15 & 16 \end{pmatrix} \]
\begin{pmatrix}
1 & 2 & 3 & 4 \\
5 & 6 & 7 & 8 \\
9 & 10 & 11 & 12 \\
13 & 14 & 15 & 16
\end{pmatrix}
              
行列 省略 \[ A = \begin{pmatrix} 1 & 0 & \cdots & 0 \\ 0 & 1 & \cdots & 0 \\ \vdots & \vdots & \ddots & \vdots \\ 0 & 0 & \cdots & 1 \end{pmatrix} \]
\begin{pmatrix}
1 & 0     & \cdots & 0      \\
0 & 1     & \cdots & 0      \\
\vdots & \vdots & \ddots & \vdots \\
0 & 0     & \cdots & 1
\end{pmatrix}
              
複数行 \[ \begin{align} f(x) & = (a+b)^2 \\ & = a^2+2ab+b^2 \\ \end{align} \]
\begin{align}
f(x) & = (a+b)^2 \\
& = a^2+2ab+b^2 \\
\end{align}
              
場合分け \[ f(n) = \begin{cases} n/2, & \mbox{if }n\mbox{ is even} \\ 3n+1, & \mbox{if }n\mbox{ is odd} \end{cases} \]
f(n) =
\begin{cases}
n/2,  & \mbox{if }n\mbox{ is even} \\
3n+1, & \mbox{if }n\mbox{ is odd}
\end{cases}
              
連立方程式 \[ \begin{cases} 3x + 5y + z &= 1 \\ 7x - 2y + 4z &= 2 \\ -6x + 3y + 2z &= 3 \end{cases} \]
\begin{cases}
3x + 5y +  z &= 1 \\
7x - 2y + 4z &= 2 \\
-6x + 3y + 2z &= 3
\end{cases}