別記事を書く際に、Microsoft Wordの数式エディタで作成した数式などをWebで表示する方法について調べた。備忘録として残しておく。
数式エディタと記法
Wordなどの数式エディタで LaTexなどの記法で入力する方法については、「Word で UnicodeMath および LaTeX を使用して行形式の数式を入力する」(Linear format equations using UnicodeMath and LaTeX in Word)に説明がある。
同様に、数式エディタのGUIで2次元形式で作成した数式をLaTeXなどの形式にして取り出すことも可能である。数式タブの変換で「{}LaTeX」を選択しておくことで、コピー・ペーストした際に、LaTexの式の表現に変換されるようになる。
UnicodeMathについては、「UnicodeMath:A Nearly Plain-Text Encoding of Mathematics
Version 3.1」に説明がある。
Webでの数式表示
MathML
Webでの数式記述としては、MathML がある。FireFox や Safariではサポートされているようだが、Chrome や Edge ではサポートされておらず、そのままでは表示できない。このため、別の方法をとることにした。
MathJax
数式をJavaScriptが利用できるブラウザで描画できるものとして MathJax がある。ブラウザを選ばず表示でき、LaTeXの表記の多くも使える。
使い方
スクリプト
次のスクリプトを数式を含むページに書いておくことで、MathJaxが使えるようになる。
1 |
<script id="MathJax-script" async="" src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"></script> |
行内数式
行内に数式を埋め込むためには \\( と \\) で数式表記を括れば良い。
たとえば、次の記述があると
1 |
円の面積\(A\)は、\( A=\pi r^2 \)と表すことができる。ここで\(r\)は、半径である。 |
次のように表示される。
円の面積\(A\)は、\( A=\pi r^2 \)と表すことができる。ここで\(r\)は、半径である。
独立した数式
独立した数式の場合には \\[ と \\] で数式表記を括れば良い。
次の記述があると
1 2 3 |
\[ f\left(x\right)=a_0+\sum_{n=1}^{\infty}\left(a_n\cos{\frac{n\pi x}{L}}+b_n\sin{\frac{n\pi x}{L}}\right) \] |
次のように表示される。
\[ f\left(x\right)=a_0+\sum_{n=1}^{\infty}\left(a_n\cos{\frac{n\pi x}{L}}+b_n\sin{\frac{n\pi x}{L}}\right) \]
数式の改行
MathJax 3 では、自動改行がサポートされていないようである。
また、\\\\だけではうまく改行ができない。\\displaylines を使う必要があるようだ。
次の記述で
1 2 3 4 5 6 |
\[ \displaylines{ \left(x+y\right)^2 &=\left(x+y\right)\left(x+y\right) \\ &=x^2+2xy+y^2 } \] |
次のように表示される。
\[ \displaylines{ \left(x+y\right)^2 &=\left(x+y\right)\left(x+y\right) \\ &=x^2+2xy+y^2 } \]
MathJaxのコマンド
MathJaxによる数式表示、MathJax で利用可能なTeXコマンド(非公式)が参考になる。
WebでのWordやExcelの表の利用
WordやExcelの表は、エクセルからテーブル(html)作成ツール を利用することで基本的な部分を HTML に変換することができる。
表と数式を組み合わせた例を次に示す。
\[L_1\] | \[L_2\] | \[L_j\] | \[L_N\] | |||
---|---|---|---|---|---|---|
\[L_1\] | \[c_{11}\] | \[c_{12}\] | \[\cdots\] | \[c_{1j}\] | \[\cdots\] | \[c_{1N}\] |
\[L_2\] | \[c_{21}\] | \[c_{22}\] | \[c_{2N}\] | |||
\[\vdots\] | \[\ddots\] | \[\vdots\] | ||||
\[L_i\] | \[c_{i1}\] | \[c_{ij}\] | \[c_{iN}\] | |||
\[\vdots\] | \[\ddots\] | \[\vdots\] | ||||
\[L_N\] | \[c_{N1}\] | \[c_{N2}\] | \[\cdots\] | \[c_{Nj}\] | \[\cdots\] | \[c_{NN}\] |