数式を提示する必要が出てきたので数式をきれいに表示する方法をしらべた。結果
というものを見つけた。
Math MLとの比較
Webページに数式を表示するためにW3C が標準化を進めている書式 MathML がある。 よく考えられているのだがMathML 耐久テスト参照）、 一番の問題はMathMLとして数式を表すための記述コード量が多くなること、 そしてMathJaxがそうであるようにLaTeX記述でWebページに数式を表示できる
MathJaxを使ってLaTeXのようにして \(4\sin^2(x)−4\cos^2(x)\) を表示するごく単純な表現
$4∖sin\^2(x)−4∖cos\^2(x)$はMathMLでは次のように長大になる。 LaTeX表式が数式を美しく簡素に表現できることがわかる。<math> <mn>4</mn> <msup> <mi>sin</mi> <mn>2</mn> </msup> <mi>x</mi> <mo>-</mo> <mn>4</mn> <msup> <mi>cos</mi> <mn>2</mn> </msup> <mi>x</mi> </math>
ということなのでMathJaxを使ってみる。
\[ y=\log_{e}x \]
がきれいに表示されるらしい。
参考
MathJaxの書き方
git submodule でバージョン管理しながらインストールgithubで公開されているリポジトリの場合、git submoduleを利用すると新しいバージョンがリリースされた時git checkout BRANCHで対応できる。
便利なのでsubmoduleでインストールする
git submodule add -b v2.6-latest https://github.com/mathjax/MathJax.git js/MathJax
MathJaxの v2.6-latest ブランチを /js/MathJax ディレクトリにインストールしている。 ローカルでデバッグする際はローカルに clone されたものを利用するので、 ダウンロードにしばらくかかる。
git status
On branch master
Your branch is up-to-date with 'origin/master'.
Changes to be committed:
(use "git reset HEAD <file>..." to unstage)
new file: .gitmodules
new file: js/MathJax
.gitmodule と js/MathJax が作られている。
cd js/MathJax/
git branch
master
* v2.6-latest
clone したディレクトリに移動、ブランチを確認してみる。
cat .gitmodules
[submodule "js/MathJax"]
path = js/MathJax
url = https://github.com/mathjax/MathJax.git
branch = v2.6-latest
.gitmodule を表示してみる。
cd js/MathJax/
git checkout 2.7-latest
更新されたブランチに変更する。 その上でリポジトリを commit すると完了。
必要となる場所より上、通常ページヘッダで
<script type="text/javascript" src="https://leico.github.io/TechnicalNote/js/MathJax/MathJax.js?config=TeX-MML-AM_HTMLorMML"></script>
と呼び出す。
To load a configuration file, use
config=filename(where filename is one of the names above without the.js) as a parameter to the URL of theMathJax.jsfile. For example<script type="text/javascript" src="https://example.com/MathJax.js?config=TeX-AMS-MML_CHTML"> </script>loads the
config/TeX-AMS-MML_HTMLorMML.jsconfiguration file from the MathJax distributed network service.
とのことで、設定プリセットが MathJax/config 以下にいくつか用意されている。
それらを呼び出すには MathJax.js?config=XXXXXとするらしい。XXXXX はファイル名から .jsを取ったもの。
loads the
config/TeX-AMS-MML_HTMLorMML.jsconfiguration file
これ間違えてるっぽい。サンプルと内容が違う。
Using MathJax on Github:Pages
Posted on 01, Oct 2012
MathJax is a simple way of including Tex/LaTex/MathML based mathematics in HTML webpages. To get up and running you need to include the MathJax script in the header of your github pages page, and then write some maths. For LaTex, there are two delimiters you need to know about, one for block or displayed mathematics
\[ ... \], and the other for inline mathematics\( ... \). InstallationYou can find the MathJax documentation here however, to get up and running quickly, simply put this into the
<head>section of the page you would like to display mathematics:<head> ... <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"> </script> ... </head>If you are using jekyll, in _config.yml set
markdown: kramdownIf it is set to discount for example, the markdown parser will automatically replace
x^2withx<sup>2</sup>which interrupts the MathJax rendering.Usage
Using it is pretty easy:
Here is an example MathJax inline rendering \\( 1/x^{2} \\), and here is a block rendering: \\[ \frac{1}{n^{2}} \\]Here is an example MathJax inline rendering \( 1/x^2 \) , and here is a block rendering: \[ \frac{1}{n^{2}} \]
The only thing to look out for is the escaping of the backslash when using markdown, so the delimiters become
\\[ ... \\]and\\( ... \\)for inline and block maths respectively.
ということで、
\\( ... \\)\\[ ... \\]上記
MathJaxを使ってLaTeXのようにして \(4\sin^2(x)−4\cos^2(x)\)
の部分は
\\(4\sin^2(x)−4\cos^2(x)\\)
と引用元と記述方法を変更している。