ASCIIMathML.js (ver 2.0): Translating ASCII math notation to MathML and graphics

Would you or your students like to easily produce good-looking math formulas on webpages
using a simple calculator-style syntax and your own ASCII or HTML editor?
Here is a free multi-platform solution (and if you prefer it, LaTeX-style formulas also work).

Now even easier to use: just add one line to your HTML file to load ASCIIMathML.js

ASCIIMathML.js is mentioned on the MathML page of the World Wide Web Consortium, also on The Math Forum.

New: MathJax 2.0 has been released and now comes with an ASCIIMath input jax!
ASTEX by Michael Ziegler is loosely based on ASCIIMathML/LaTeXMathML and extends them
to work in most browsers as well as with 3d graphs, quiz questions and code-highlighting
A german translation of the ASCIIMathML homepages.
The STIX fonts have finally been released (download and select STIXGeneral as default font in Firefox).
ASCIIMath now with automatic math recognition mode, better LaTeX support and graphics integration
A Moodle filter and a PmWiki cookbook are also available
ASCIIMath Image Fallback Scripts by David Lippman (including a Moodle filter)
and a LaTeXMathML version of ASCIIMathML by Dr Douglas R. Woodall (examples)
ASciencePad is a WYSIWYG editor that integrates TiddlyWiki, ASCIIMathML and ASCIIsvg graphs.
It's free and works locally (no installation or server required).
Useful information about ASCIIMathML by James Gray, including a nice tutorial.
ASCIIMathML also works with S5 (CSS Presentation slide show; S5 ASCIIMath example)
and in valid XHTML pages with standard MathML and SVG in several browsers.
ASCIIMathML is being used with Movable Type, WordPress, phpBB, and many wikis.
Also available: A PHP port of ASCIIMathML.js to ASCIIMathPHP by Steven Chan.

This is the main page (HTML version) for the ASCIIMathML.js script which allows incorporating mathematical formulas on webpages with a minimum of fuss (just add one line to a webpage to load the script). If you like what you see, choose Save As... in your browser and this page should work equally well locally on your machine.

This page requires Internet Explorer 6 + MathPlayer or Firefox/Mozilla/Netscape.

ASCIIMathML.js is freely available under the GNU Lesser General Public License. You can get your own copy from the ASCIIMathML.js download page. The script works with both HTML and XHTML webpages. (The homepage for an XML version is at asciimath.xml but is no longer maintained). As noted above, MathML on IE requires MathPLayer and for Firefox one needs to install some math fonts.

If you use it on a webpage, please send me an email at jipsen@chapman.edu with the URL so that I can add a link to it on the users page. (Also send me an email if you have problems or would like to provide some feedback.) I'm currently using ASCIIMathML on a Wikiserver for lecture notes and my students are also using it in Moodle for writing and reading homework in their calculus class and discrete mathematics class. If you just want to display MathML on HTML pages using Netscape/Mozilla/Firefox or IE+MathPlayer, have a look at mathhtmltest (the page includes a 50 line JavaScript program that does the trick).


Let's test the ASCIIMathML.js translator on a simple example.

amath Example: Solving the quadratic equation. Suppose a x^2+b x+c=0 and a!=0. We first divide by \a to get x^2+b/a x+c/a=0. Then we complete the square and obtain x^2+b/a x+(b/(2a))^2-(b/(2a))^2+c/a=0. The first three terms factor to give (x+b/(2a))^2=(b^2)/(4a^2)-c/a. Now we take square roots on both sides and get x+b/(2a)=+-sqrt(((b^2)/(4a^2)-c/a)). Finally we subtract b/(2a) from both sides and simplify to get the two solutions: x_(1,2)=(-b+-sqrt(b^2 - 4a c))/(2a)

endamath

Here is the text that was typed in (using the new auto-math-recognize mode started by "a``math"):

amath
Example: Solving the quadratic equation.
Suppose a x^2+b x+c=0 and a!=0. We first divide by \a to get x^2+b/a x+c/a=0. 

Then we complete the square and obtain x^2+b/a x+(b/(2a))^2-(b/(2a))^2+c/a=0. 
The first three terms factor to give (x+b/(2a))^2=(b^2)/(4a^2)-c/a.
Now we take square roots on both sides and get x+b/(2a)=+-sqrt((b^2)/(4a^2)-c/a).

Finally we move the b/(2a) to the right and simplify to get 
the two solutions: x_(1,2)=(-b+-sqrt(b^2-4a c))/(2a)

If you don't believe this, copy the text and paste it on the ASCIIMathML.js: Try it yourself demo page.

Here are a few more examples:

Type this See that Comment
\`x^2+y_1+z_12^34\` `x^2+y_1+z_12^34` subscripts as in TeX, but numbers are treated as a unit
\`sin^-1(x)\` `sin^-1(x)` function names are treated as constants
\`d/dxf(x)=lim_(h->0)(f(x+h)-f(x))/h\` `d/dxf(x)=lim_(h->0)(f(x+h)-f(x))/h` complex subscripts are bracketed, displayed under lim
\$\frac{d}{dx}f(x)=\lim_{h\to 0}\frac{f(x+h)-f(x)}{h}\$ $\frac{d}{dx}f(x)=\lim_{h\to 0}\frac{f(x+h)-f(x)}{h}$ standard LaTeX notation is an alternative
\`f(x)=sum_(n=0)^oo(f^((n))(a))/(n!)(x-a)^n\` `f(x)=sum_(n=0)^oo(f^((n))(a))/(n!)(x-a)^n` f^((n))(a) must be bracketed, else the numerator is only `a`
\$f(x)=\sum_{n=0}^\infty\frac{f^{(n)}(a)}{n!}(x-a)^n\$ $f(x)=\sum_{n=0}^\infty\frac{f^{(n)}(a)}{n!}(x-a)^n$ standard LaTeX produces the same result
\`int_0^1f(x)dx\` `int_0^1f(x)dx` subscripts must come before superscripts
\`[[a,b],[c,d]]((n),(k))\` `[[a,b],[c,d]]((n),(k))` matrices and column vectors are simple to type
\`x/x={(1,if x!=0),(text{undefined},if x=0):}\` `x/x={(1,if x!=0),(text{undefined},if x=0):}` piecewise defined functions are based on matrix notation
\`a//b\` `a//b` use // for inline fractions
\`(a/b)/(c/d)\` `(a/b)/(c/d)` with brackets, multiple fraction work as expected
\`a/b/c/d\` `a/b/c/d` without brackets the parser chooses this particular expression
\`((a*b))/c\` `((a*b))/c` only one level of brackets is removed; * gives standard product
\`sqrt sqrt root3x\` `sqrt sqrt root3x` spaces are optional, only serve to split strings that should not match
\`<< a,b >> and {:(x,y),(u,v):}\` `<< a,b >> and {:(x,y),(u,v):}` angle brackets and invisible brackets
\`(a,b]={x in RR | a < x <= b}\` `(a,b]={x in RR | a < x <= b}` grouping brackets don't have to match
\`abc-123.45^-1.1\` `abc-123.45^-1.1` non-tokens are split into single characters,
but decimal numbers are parsed with possible sign
\`hat(ab) bar(xy) ulA vec v dotx ddot y\` `hat(ab) bar(xy) ulA vec v dotx ddot y` accents can be used on any expression (work well in IE)
\`bb{AB3}.bbb(AB].cc(AB).fr{AB}.tt[AB].sf(AB)\` `bb{AB3}.bbb(AB].cc(AB).fr{AB}.tt[AB].sf(AB)` font commands; can use any brackets around argument
\`stackrel"def"= or \stackrel{\Delta}{=}" "("or ":=)\` `stackrel"def"= or \stackrel{\Delta}{=}" "("or ":=)` symbols can be stacked
\`{::}_(\ 92)^238U\` `{::}_(\ 92)^238U` prescripts simulated by subsuperscripts

If you are familiar with MathML, you can appreciate that this ASCII input form is less verbose and more readable. If you are familiar with TeX, this is still somewhat less cluttered. The aim is to have input notation that is close to graphing calculator notation, so that students are able to use it on webpages and in emails without having to learn another specialized syntax.

For an explicit description of the input syntax see ASCIIMathML.js Syntax and List of Constants.

Acknowledgements: Many thanks to the numerous people who have contributed to the fantastic MathML standard. Without such a well designed standard, a project like this would be impossible.
Thanks to the many volunteers who implemented MathML in the Gecko layout engine for Netscape7/Mozilla/Firefox.
Thanks to the people at Design Science for producing the excellent MathPlayer plugin and making it freely available.
Finally, thanks to the designers and implementors of JavaScript. All these tools work together fairly seemlessly to allow us to put mathematical formulas on webpages in a convenient and inexpensive way.
And thanks to Andrew White for making a logo for ASCIIMathML (see below).


ASCIIMathML Peter Jipsen, Chapman University, February 2012 Valid HTML 4.01!

ASCIIMathML