Convert html containing mathjax markups to pdf

Question

I have come across a tool called princexml that can convert html+css into pdf beautifully (see this video). With this it's even possible to write a PhD thesis using entirely html+css and get a nice pdf output in the end. But it seems it does not handle mathjax well. I guess this is because the mathjax part much be rendered in a browser first.

So I have a simple html file like this:

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<title>test math</title>
<style type="text/css">
</style>


<script src='http://cdn.mathjax.org/mathjax/latest/MathJax.js' type='text/javascript'>
    MathJax.Hub.Config({
        HTML: ["input/TeX","output/HTML-CSS"],
        TeX: { extensions: ["AMSmath.js","AMSsymbols.js"],
               equationNumbers: { autoNumber: "AMS" } },
        extensions: ["tex2jax.js"],
        jax: ["input/TeX","output/HTML-CSS"],
        tex2jax: { inlineMath: [ ['$','$'], ["\\(","\\)"] ],
                   displayMath: [ ['$$','$$'], ["\\[","\\]"] ],
                   processEscapes: true },
        "HTML-CSS": { availableFonts: ["TeX"],
                      linebreaks: { automatic: true } }
    });
</script>

</head>

<body>

$x^2 + y^2 = 1$

</body>
</html>

After conversion using princexml:

prince --javascript x.html -o x.pdf

the equation is rendered verbatim in the pdf.

Is there a way to make this work?

Note from the future: cdn.mathjax.org is nearing its end-of-life, check https://www.mathjax.org/cdn-shutting-down for migration tips. — Peter Krautzberger, Apr 21 '17 at 07:15

score 6 · Answer 1 · edited May 03 '19 at 02:20

This is because princexml doesn't yet support setTimeout method which Mathjax uses for its asynchronous functions. There are two workarounds:

Render your html in the browser such as Chrome first. Get the entire document (not the source but actual rendered document) saved into html file and then use it as input to prince. You can get entire rendered document from browser javascript console.
Second method is to use a headless browser like phantomjs. See also https://web.archive.org/web/20150503191319/http://www.lelesys.com/en/media/technology/phantomjs-as-screen-capture-to-generate-image-pdf-files.html

Convert html containing mathjax markups to pdf

1 Answers1