Technology

MathJax

2013-09-09JavaScript

MathJaxは、ウェブブラウザ上で数式を表示するためのJavaScriptライブラリです。 数式を綺麗に表示することができ、数式もLaTeXの文法で書けば良いので、手軽に数式を書くことができます。

ちゃんとレンダリングされるとこんな感じ…。
mathjax

MathJaxのライブラリには、JavaScriptファイルに加えて、フォントファイルも含まれています。だから、文字がきれいなのですが、その分、ライブラリ全体の容量が大きいのが気になります(最新のMathJax-2.2で、17.0MBあります)。

そこで、気軽に使うためにCDNを利用すると良いでしょう。必要なスクリプトをhead内に書けば、本文で指定した箇所を数式にしてくれます。

01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
<html>
  <head>
    <title>MathJax Test</title>
    <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
    <script type="text/x-mathjax-config">
      MathJax.Hub.Config({tex2jax: {inlineMath: [['$','$'], ['\\(','\\)']]}});
    </script>
  </head>
  <body>
    <p>
      When $a \ne 0$, there are two solutions to \(ax^2 + bx + c = 0\) and they are
      $$x = {-b \pm \sqrt{b^2-4ac} \over 2a}.$$
    </p>
  </body>
</html>

詳しいことについては、公式ページのDocumentationか、くろきげんさんの、MathJaxの使い方を参照すると良いと思います。

また、WordPressに導入する際は、MathJax-LaTeXを使うと良いでしょう。

Bookmark this on Hatena Bookmark

Topic