Thursday, November 1, 2012

iBooks3 needs iOS6 to support MathML

One of the promises that Tim Cook made in his quick demonstration of iBooks3 last Tuesday was support for MathML. The example he showed was created with iBooks Author, and since I'm still not a convert, I tried a Math textbook not created with iBA as soon as I could after downloading iBooks3.

And was disappointed.

Here's a screenshot that I took with iBooks3 on iOS5:

MathML in iBooks 3 on iOS5

Notice that the alignment is off, and several characters cannot be properly displayed and so are shown with empty boxes instead. Icks.

So I wondered if there was something magic (or tricky) about the way iBooks Author creates the MathML. But everything I heard said that wasn't the case.

I figured out the answer yesterday. iBooks 3 needs iOS6 to support MathML.

Here is the same section of the book (though now slightly repaginated), after upgrading to iOS6 (but with the exact same version of iBooks3):

MathML in iBooks3 in iOS6

MathML in iBooks3 with iOS6

Of course, the beauty of MathML is that the equations are just text, and thus can be made bigger or smaller to suit the reader. When I bump up the text size, the equation maintains its beautiful formatting:

MathML in iBooks3 in iOS6 (big!)

MathML, like Asian language support, is one of the key features that make EPUB3 such an important standard. Without MathML, there are no math or science textbooks.

I hear there are other new features in iBooks3 dependent on iOS6. I will continue to highlight them here. If you subscribe to this blog, I'll send my new updates right to your mailbox.


  1. The iOS5 iOS6 difference is probably due to an old Safari bug that prevents it from accessing the STIX fonts correctly. It's worth a try to use some other mathematical fonts.

    But there is a difference wrt iBooks Author -- and this really bugs me.

    The thing is, webkit's MathML support (and hence Safari, hence iBooks) is still a significant bit behind e.g. Firefox. (This year has seen the addition of a very good volunteer working on MathML support -- but nobody else.)

    Knowing this, you can try to break things...

    If you take some TeX code like \widehat{aaaa} in iBooks Author, then you'll get a decent rendering. However, the corresponding MathML (not sure if it will make it through in the comments)



    will render quite badly. (It's not surprising because WebKit currently doesn't support horizontal stretches.)

    So iBooks Author does some magic to render LaTeX input (as SVG most likely, I didn't check) whereas it doesn't do the same magic for MathML input.

  2. Oh well, the MathML didn't make it. You can generate it, e.g., at (set latex + get MathML)

  3. Peter, for reference the MathML generated by iBooks Author is something like this:

    <math xmlns=""><mover><mrow><mi>a</mi><mi>a</mi><mi>a</mi><mi>a</mi></mrow><mo stretchy="true" accent="true">̂</mo></mover></math></span>

    It does not render correctly in a naïve epub file, and I didn't notice any SVG magic in the ibooks author output. But iBooks Author does include an "equationEnvironment.xml" file which is referenced by a "ibooks:equationEnvironment" meta tag in the OPF file. It appears that the XML file configures MathML layout and font usage.

    I've tried adding the xml to my test epub and referencing it in a similar manner, but it doesn't seem to help.

  4. MathML uses a combination of HTML, CSS, and SVG to render numbers sort of like a graphic. I suspect that even though SVG has been supported for quite a while now in IOS that this latest release unleashed a more robust form of it that allowed MathML to now render properly in a way that it couldn't have before.

    Flash ActionScript-3 has allowed the use of MathML with swf since about 2008. SVG always runs a couple of years behind SWF developments since it's basically just a SFW copy.

  5. By the way, this may seem rather obvious, but for those newish to eBook formatting let me say that, yes, you could just use SVG image files of the math equations and insert them in the text with tables just as easily, though not as elegantly.

    Actually I've never done it, but it would seem a fairly simple procedure as long as your target device can render both tables and SVG files.

  6. @Steve thanks for adding the mathml code (how did you do it?). The reason why I think that particular stretch-magic is SVG is that you can't copy&paste it out of iBooks at all while IIRC native MathML rendering can be copied (albeit poorly given the clipboard).

    @ebookPioneers MathML is usually rendered by specific code in each browser engine. Of course, this tends to re-use code for regular HTML but no native browser implementation renders MathML via SVG -- this defeats the purpose of MathML enabling accessbility, copy&paste etc. While epub3 does allow for fallback images for MathML, MathML is still the suggested, i.e., "philosophically" right, way to include mathematical content in epub files (and elsewhere) -- SVG is, imho, bad practice.

  7. Peter,

    MathML cannot work without vector graphics (or perhaps we should say "vector statements) whether SWF or SVG. It must render math equations as vector...well, not images, but something very much like them where points and curves are charted and mathematically represented. I believe TrueType fonts are rendered this way too. Yes, they can be copy/pasted just like regular text. Frankly, I don't know how that's done.

    As to using regular vector graphics inline with text for math "images" etc., this can be done just fine as long as the browser/eReeader is capable of scaling both the text and graphics together and can render tables. Unfortunatley, none of the tablets or Ink readers Amazon makes will scale SVG graphics with the text. I don't know if iPad will or not for sure, but it was my understanding that it could.

  8. Hi Liz,

    I've discovered a number of issues between iBooks 3 with IOS5 and 6. Some bugs appear in one, while not in the other. Specifically with font sizing. Sometimes we will have a book on IOS5 display perfectly fine, while on the new ipad with IOS6 (iPad4) the text bunches together. This is fixed by resizing the font and going back to the original size, and it works. Doesn't occur in the earlier versions though.

  9. This isn't relevant to MathML per se, but I thought I'd mention that I had a textbook of mine converted from PDF to ePub by a conversion company, and I contracted with them to experimentally render the equations using SVG so that they would scale with the text. It worked out very well, and I now distribute the book through the Apple store. Bad news, though: The rendering of equations was excellent in iBooks under iOS5 but broke completely in iOS6 (same version of iBooks). I contacted Apple but haven't been given any encouragement that it will be fixed any time soon.
    In short, my eBook is basically useless on any up-to-date iPad.


More of my books