Tuesday, December 22nd, 2009
MathJax: Rich Math display from LaTeX and MathML
<p>I am sure MathML took off somewhere, but I never really saw it. MathJax seems to have a chance at being a practical solution that offers a high quality display of LaTeX and MathML math notation in HTML pages.You can embed the following LaTeX right in your page:
-
-
<p>The Lorenz Equations</p>
-
[begin{matrix}
-
dot{x} & = & sigma(y-x) \
-
dot{y} & = & rho x - y - xz \
-
dot{z} & = & -beta z + xy
-
end{matrix} ]
-
-
<p>The Cauchy-Schwarz Inequality</p>
-
-
[ left( sum_{k=1}^n a_k b_k right)^2 leq left( sum_{k=1}^n a_k^2 right) left( sum_{k=1}^n b_k^2 right) ]
-
-
<p>A Cross Product Formula</p>
-
-
[mathbf{V}_1 times mathbf{V}_2 = begin{vmatrix}
-
mathbf{i} & mathbf{j} & mathbf{k} \
-
frac{partial X}{partial u} & frac{partial Y}{partial u} & 0 \ frac{partial X}{partial v} & frac{partial Y}{partial v} & 0
-
end{vmatrix} ]
-
-
<p>The probability of getting (k) heads when flipping (n) coins is: </p>
-
-
[P(E) = {n choose k} p^k (1-p)^{ n-k} ]
-
-
<p>An Identity of Ramanujan</p>
-
[ frac{1}{(sqrt{phi sqrt{5}}-phi) e^{frac25 pi}} =
-
1+frac{e^{-2pi}} {1+frac{e^{-4pi}} {1+frac{e^{-6pi}}
-
{1+frac{e^{-8pi}} {1+ldots} } } } ]
-
and then you get the following output:

It has some cool features like math accessibility, cut and paste interoperability and an API for integration.
In fact, take a peak at the source code for MathJax. Interesting to see.
Note:
MathJax grew out of the popular jsMath project, an earlier Ajax-based math rendering system developed by Davide Cervone in 2004. In the intervening time, there have been many significant developments relevant for web publication of mathematics: consolidation of browser support for CSS 2.1, Web Font technology, adoption of math accessibility standards, and increasing usage of XML workflows for scientific publication. Consequently, Cervone and others are designing and developing MathJax from the ground up as a “next-generation” platform, while still benefiting from the extensive real-world experience gained from jsMath.
Related Content:











Now that is some seriously cool stuff! Gosh, I wish I had that back in college (was a math major).
Interesting, but does not work on Firefox 3.5.6 (LINUX)
Very impressive. And all done with real text! Wow.
I like that they’ve used a jack in their logo :)
Wow, at first I assumed this was like that silly jQuery plugin that called out to a web service to do the rendering, but MathJax actually uses JavaScript to generate properly formatted text. Impressive.
This is great. All is done with real text. Impressive.