Powered by MathJax

Mathematics notation for short web messages

Expressing mathematics on the web in a few quick lines of text on a discussion forum or blog is simple enough when the math is simple too. Plain text mathematical expressions like f(x)=x^2+2x  and integral{0 to x} g(x) dx can be used for communicating mathematics anywhere with any HTML editor, the one in UW-ACE for example.

To communicate more mathematics it is nice to have a quick way of composing standard mathematical expressions. One way to do this is to borrow the math notation from longer mathematics documents written using the long-established document system TeX/LaTeX.

The LaTeX notation uses the backslash \ character to begin a symbol or command. For example, \Pi for \(\Pi\), \Omega for \(\Omega\) and \sum for the summation symbol \(\sum\).

It is not too hard to find the corresponding symbols of the LaTeX expression \left( \sum_{k=1}^n a_k b_k \right)^{2} on the left side of this equation:
\( \left( \sum_{k=1}^n a_k b_k \right)^{2} \le \left( \sum_{k=1}^n a_k^2 \right) \left(\, \sum_{k=1}^n b_k^2 \right)\)

A page of LaTeX symbols and examples is needed to see how to arrange the many math symbols available. Wikipedia is helpful here.

In order to write short messages with LaTeX math in forums and email there are programs like MathJax to translate LaTeX notation into HTML plus MATHML. To use MathJax, start your message with the HTML line

<script type="text/javascript" src="http://www.math.uwaterloo.ca/~pkates/MathJax/MathJax.js"></script>
then follow the line with the text of the message plus LaTeX notation for mathematics as in the examples above. The MathJax program is written in Javascript. The browser runs the Javascript program converting the LaTeX notation into MATHML which the browser then displays. The Javascript program has to be located at some web site. You can use the site above or install the program on your own web site.

Here is an example of aligning equations. You write in HTML

<script type="text/javascript" src="http://www.math.uwaterloo.ca/~pkates/MathJax/MathJax.js"></script>
\begin{eqnarray}
mA &=&nA^{2} \\
mA-nA^{2} &=&0 \\
A\left( m-nA\right) &=&0
\end{eqnarray}
and the result is \begin{eqnarray} mA &=&nA^{2} \\ mA-nA^{2} &=&0 \\ A\left( m-nA\right) &=&0 \end{eqnarray}

Inline math (math in lines of text) is inserted between \ ( and \ ) e.g. this \ (\mathbf{X}[k+1]=A\mathbf {X}[k]+B\mathbf{u}[k]\ ) becomes \(\mathbf{X}[k+1]=A\mathbf {X}[k]+B\mathbf{u}[k]\)

Displayed math (centered without surrounding text on the line) is inserted between $ $ or between \ [ and \ ] e.g. $$\mathbf{X}[k+1]=A\mathbf {X}[k]+B\mathbf{u}[k]$$ \[ x\left( x-1\right) =x^{2}-x \] $$ \left(\, \sum_{k=1}^n a_k b_k \right)^{\!\!2} \le \left(\, \sum_{k=1}^n a_k^2 \right) \left(\, \sum_{k=1}^n b_k^2 \right)$$ $$f(x) = \frac1{\sigma\sqrt{2\pi}} \int_{-\infty}^x e^{-\frac{(t-\mu)^2}{2\sigma^2}}dt$$ \[ \int_0^\infty e^{-x} \, dx \]

Examine the HTML source code of this page to see the LaTeX markup.

MATHML is HTML-looking notation for expressing mathematics in browsers. Writing MATHML is too difficult to do by hand, but there are visual HTML editors that make it easy to create math notation. I'll talk about such editors in the next blog posting, but in the meantime take a look at a Firefox addon called Firemath.

If you would like to know more please get in touch by phone or email.

Paul Kates
Math Liaison
Centre for Teaching Excellence
x37047, pkates@uwaterloo.ca.