読者です 読者をやめる 読者になる 読者になる

iPX社員によるブログ

iPX社員が"社の動向"から"自身の知見や趣味"、"セミナーなどのおすすめ情報"に至るまで幅広い話題を投下していくブログ。社の雰囲気を感じ取っていただけたら幸いです。

MathJaxによる数式の表現

自己紹介

iPXの砂子と申します。現在業務ではCAE関連のアプリ開発を行っています。WEB系はあまり馴染みがないため、ブログを書くついでに知識を蓄えたいです。

数式の必要性

技術系の文章を書く際に数式の記述は避けては通れない。そしてできれば美しく表現したいと思う。そこでMathJaxによる数式の記述の方法を調べてみた。

MathJax

Webブラウザで数式を表現するためのオープンソースの描画エンジン。Javascriptで実装されている。


MathJax

私は愛用しているテキストエディタEmacsOrg-modeが文書をHTMLにExportする際に使用していたのでその存在を知りました。Webで数式を表現する際のデファクトスタンダード?

はてなブログでの使用方法

下記のブログを参考にした。


はてなブログでの数式の書き方 - 理系ジン

はてな記法では細かい設定がしづらい(?)ようなので記事本文のHTMLにMathJaxのスクリプト要素を入れ込む。

<script type="text/x-mathjax-config">
MathJax.Hub.Config({
  tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}
});
</script>
<script type="text/javascript" src="path-to-mathjax/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>

サンプル

幾つか数式を記述してみる。

文章中の数式

2の平方根は$\sqrt2$になります。

別行立ての数式

下記の数式は単振り子の運動方程式です。

\[\frac{d^2\theta}{dt} = - \frac{g}{L} \sin\theta\]

連立方程式

\[ \begin{array} {@{}1}   x_{1} + x_2 + x_3 & = & 6 \\ -x_1 + 2x_2 & = & 3\end{array} \]

 まとめ

大方の目標はクリアできた。簡単な数式なら表現できる。ただ、ブログの編集を見たままモードでやったせいかMathJaxのLaTeX形式の箇所に改行が入れるとうまく認識してくれなかった。はてなブログはMarkdown等でも記述できるようなのでそっちでも試してみたい。最終的にはEmacsで編集をやりたいです。