Webに数式を書こう MathJax MathML 数式
こんばんは!数式・日本語・英語SpotOCRのもしゃ君です。
今回はwebページ、ホームページの中に数式を書く方法に書きます。
数式の書き方は主に次の3つです
1.MathJaxを用いる
*メリット :Tex数式コマンドが使える、手軽、綺麗
*デメリット:重い、オフラインで見えない、大量の数式を載せると落ちる、Texコマンドを知らないと出来ない。
2.画像で表示する
*メリット :最も手軽で簡単
*デメリット:レイアウトが制限される、解像度が低いと汚く、高いと重い
3.MathMLを用いる(FireFox限定)
*メリット :軽い、早い、数式が大量に出てくる時におすすめ
*デメリット:FireFoxでしか見れない。MathMLを知らないと出来ない
1.MathJaxを用いる場合
最近流行(?)のMathJax。こちらにMathJaxを用いたWebページのひな形を用意したのでダウンロードして下さい。
https://dl.dropboxusercontent.com/u/41895451/mathpage.html.zip
ポイントは<head>〜</head>の部分に
<script type="text/x-mathjax-config">
MathJax.Hub.Config({ tex2jax: { inlineMath: [['$','$'], ["\\(","\\)"]] } });
</script>
<script type="text/javascript"
src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_HTML">
</script>
<meta http-equiv="X-UA-Compatible" CONTENT="IE=EmulateIE7" />
が追加してあること。サンプルにあるように<body>〜</body>内部のいずれかの場所にTexコマンドを書くと数式が表示されます。
*良いところ
Texコマンドで数式が打てる。おそらく最も手軽
*悪いところ
重い。とにかくスマホで見るとより表示が重くなる。
(例)
MathJaxはこんな感じ
$\displaystyle \mathrm{R}_{k}=\frac{1}{N}\sum_{1=0}^{N-1}f_{l}\mathrm{c}\mathrm{o}\mathrm{s}\frac{2\pi\lambda}{N}$
(Texコマンド)
\displaystyle \mathrm{R}_{k}=\frac{1}{N}\sum_{1=0}^{N-1}f_{l}\mathrm{c}\mathrm{o}\mathrm{s}\frac{2\pi\lambda}{N}
2.画像として貼付ける
Windowsをお使いの方はSnapCrab( http://www.fenrir-inc.com/jp/snapcrab/ )など
Macをお使いの方は「command+shift+4」でデスクトップのスクリーンショットが取れます。
(例)
画像はこんな感じ
スクリーンショットして画像をアップするだけですが、フォントサイズ・背景色・改行など逆に面倒なことが時折。何よりちょっと汚いです
3.MathMLを用いる場合
最も高速で動作し、手間のかかり、ブラウザも制限されるのがMathML
なんとFireFoxでしか閲覧出来ませんw
表示方法も、文字認識の天敵w
なんだこの∑の書き方w
GoogleChromeも一度MathMLに対応しましたが、バグがあったとかで今は対応を延期しています。
(なので、この下はFireFoxでしか正しく表示されませんw)
(例)(FireFoxで開いてね)
MathMLはこんな感じ
とにかく書くのが面倒!上の数式を書くのにこんなにコマンドが必要ですw
<math xmlns><msub><mi mathvariant="normal">R</mi><mrow><mi mathvariant="italic">k</mi></mrow></msub><mi mathvariant="normal">=</mi><mfrac><mrow><mn mathvariant="normal">1</mn></mrow><mrow><mi mathvariant="italic">N</mi></mrow></mfrac><munderover><mstyle displaystyle="true" mathvariant="normal"><mo>∑</mo></mstyle><mrow><mn mathvariant="normal">1</mn><mi mathvariant="normal">=</mi><mn mathvariant="normal">0</mn></mrow><mrow><mi mathvariant="italic">N</mi><mo mathvariant="normal">-</mo><mn mathvariant="normal">1</mn></mrow></munderover><msub><mi mathvariant="italic">f</mi><mrow><mi mathvariant="italic">l</mi></amrow></msub><mi mathvariant="normal">cos</mi><mfrac><mrow><mn mathvariant="normal">2</mn><mi mathvariant="italic">π</mi><mi mathvariant="italic">λ</mi></mrow><mrow><mi mathvariant="italic">N</mi></mrow></mfrac></math>
うーんありえんw
こんなん書けるか!と思った方、同感です。
(おわり)
いかがでしたか?
Web×数式はまだまだハードルが高いですね。
「自分はWordでしか数式は書かないんだよ!」でも「画像は嫌なんだよ!」とか
「Texを書くのが面倒いよ!」「MathML意味わからん!」
という方、21世紀はあなたを見捨てません
Moshaがあなたの問題を解決!(宣伝かい!笑)
MoshaがWeb×数式の敷居を下げます!次回乞うご期待!
Mosha 数式文章画像のテキスト化
https://www.moshaspot.com/