jsMath
by Brian Hayes
Published 28 December 2008
A famous equation:
$$\nabla\times\mathbf{E}=-\frac{\partial\mathbf{B}}{\partial{t}}$$
Imagine that—mathematics on the Web!
Double-click for the LaTeX source. There’s more info in the tiny box you ought to find in the lower right hand corner of your browser window.
I’ll have more to say about all this in a few days.
Responses from readers:
Please note: The bit-player website is no longer equipped to accept and publish comments from readers, but the author is still eager to hear from you. Send comments, criticism, compliments, or corrections to brian@bit-player.org.
Publication history
First publication: 28 December 2008
Converted to Eleventy framework: 22 April 2025
The equation looks great when I go directly to your web site, but in Google Reader, all I see is LaTeX source.
Yep. And it’s not Google Reader’s fault. The LaTeX is processed by some JavaScript code that doesn’t get packaged up in the RSS feed. Is there a way to fix that? I don’t think so, but I’d be delighted to learn I’m wrong.
If readers have other favorite techniques for rendering math (or other specialized notations) in blogs and on web pages, I’m eager to hear about it.
I’m partial to turning the entire equation to a PNG image. It works well that way, and show up find in RSS feeds. It can also be cut-and-pasted into a document. Wikipedia uses images for their equations.
Brian: you’re right, there’s no way to get javascript into RSS readers. That said, this is very interesting. I’m a big fan of client-side rendering and I hadn’t heard of jsMath.
My current hobby project all about a better way to turn latex into web pages. I start from the output of latex2html and process the output in a variety of ways. In particular, I’ve solved the problem of PNG-rendered math making your lines too tall. I will be announcing this in a few days.
Shouldn’t there be a bit more white space on each side of the equal sign, as there is around the times symbol? The equation looks a little crowded on the right.
FWIW, I’m seeing an ampersand, not \partial on both Firefox and Safari running under Mac OS 10.5.
@Peter Petto: Could you open the jsMath control panel (lower right corner of the browser window) and try some of the options offered there? Do you have the TeX fonts loaded, or are you using images?
I’m curious to know what’s going wrong. Although I should add that jsMath isn’t my software, and I’m unlikely to have useful advice on fixing it.
I am also running Firefox under Mac OS 10.5. At first I couldn’t see the nabla, but after downloading the js math fonts, I see it.
On WordPress blogs you can use LaTex directly. See this post for an example. The code behind the first equation is:
$latex g(\mu,\sigma^2|y) \propto \frac{1}{\sigma^{n+2}} \exp \left( - \frac{1}{2 \sigma^2}(S + n(\mu-\bar{y})^2)) \right)$
Website weirdness: The nabla symbol has suddenly disappeared from the equation on my browser (Safari, on a MacBook). It was there the last time I checked (a day or two ago), but now… gone!
Paul Zorn confirms it’s missing on his machine (also a MacBook) as well. All we see on our respective screens is a little empty rectangle where there used to be an upside-down triangle. A mathematical instantiation of the Cheshire Cat?
About the missing nabla: I’m curious about what’s going awry, but I don’t have much to go on. The equation continues to display correctly on my system, in various browsers (Firefox, Safari, Opera, Camino). Could anyone with an invisible nabla—or other failures—give some more details? In particular, are you using the LaTeX fonts or images or Unicode? (See the jsMath control panel.)
In the list of known jsMath bugs, the only entry that seems possibly relevant is this one:
Ideally, there shouldn’t even exist need for such extra js libraries or prerendered PNGs! There already exists a web standard recommendation implemented in XML called MathML. This is already fully supported by Opera and with Firefox requiring a special font to be downloaded (although it seems to work for me without doing so). Internet Explorer on the other hand fails badly in even displaying the page, unsurprisingly. A few example pages can be found here. MathML also makes it possible for browsers to handle formulas more efficiently, for example Firefox allows you to copy a given formula as text with all the correct symbols.
Whoa, I didn’t even know you can write that formula with code. Now only if I knew what that formala was for, I might use it.
@Martin V: MathML has enjoyed wide acceptance as a format for software to validate and represent mathematical expression as data structures, BUT not for human entry. That is, I don’t see anyone writing their expressions in MathML instead of TeX, now or in the future. The challenge in Math on the web isn’t the data format (we have MathML and TeX) but the challenge is having browsers render those formats. Granted MathML is recognized and renderable by some browsers, but not ALL, nor with consistent quality. So since javascript is so ubiquitous these days and browsers are agreeing on how to support server-side font specifications faster than they are implementing MathML rendering, we have jsMath. But don’t take my word for it, read the bottom of the page at
http://www.math.union.edu/~dpvc/jsMath/welcome.html