mathjax / MathJax-node

MathJax for Node
Apache License 2.0
615 stars 97 forks source link

page2svg baseline bug #254

Closed PatrickMassot closed 8 years ago

PatrickMassot commented 8 years ago

I hit a strange base line bug when using page2svg which does not happen using the client-side SVG rendering. The following page

<!DOCTYPE html>
<html lang="en">
<head>
<script src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS_SVG" type="text/javascript">
</script>
</head>
<body>
Compare \(A_+\) and \(A_-\).
</body>
</html>

yields the correct result mathjax_output Wheareas removing the script tag but using page2svg gives: page2svg_output

This happens with mathjax-node@0.5.1 (commit 83e67a2), node@4.3.1, the output is seen under Firefox 45.2.0 and Chromium Version 49.0.2623.87 running on Debian stretch/sid (64-bit).

dpvc commented 8 years ago

I am not able to reproduce the problem. This is the page2svg output for me (Mac OS X 10.11.5):

node

Can you provide the output file itself?

PatrickMassot commented 8 years ago

Output file is:

<!DOCTYPE html>
<html lang="en"><head><style id="MathJax_SVG_styles">.MathJax_SVG_Display {text-align: center; margin: 1em 0em; position: relative; display: block!important; text-indent: 0; max-width: none; max-height: none; min-width: 0; min-height: 0; width: 100%}
.MathJax_SVG .MJX-monospace {font-family: monospace}
.MathJax_SVG .MJX-sans-serif {font-family: sans-serif}
.MathJax_SVG {display: inline; font-style: normal; font-weight: normal; line-height: normal; font-size: 100%; font-size-adjust: none; text-indent: 0; text-align: left; text-transform: none; letter-spacing: normal; word-spacing: normal; word-wrap: normal; white-space: nowrap; float: none; direction: ltr; max-width: none; max-height: none; min-width: 0; min-height: 0; border: 0; padding: 0; margin: 0}
.MathJax_SVG * {transition: none; -webkit-transition: none; -moz-transition: none; -ms-transition: none; -o-transition: none}
.mjx-svg-href {fill: blue; stroke: blue}
</style></head><body><svg style="display: none;"><defs id="MathJax_SVG_glyphs"><path stroke-width="1" id="MJMATHI-41" d="M208 74Q208 50 254 46Q272 46 272 35Q272 34 270 22Q267 8 264 4T251 0Q249 0 239 0T205 1T141 2Q70 2 50 0H42Q35 7 35 11Q37 38 48 46H62Q132 49 164 96Q170 102 345 401T523 704Q530 716 547 716H555H572Q578 707 578 706L606 383Q634 60 636 57Q641 46 701 46Q726 46 726 36Q726 34 723 22Q720 7 718 4T704 0Q701 0 690 0T651 1T578 2Q484 2 455 0H443Q437 6 437 9T439 27Q443 40 445 43L449 46H469Q523 49 533 63L521 213H283L249 155Q208 86 208 74ZM516 260Q516 271 504 416T490 562L463 519Q447 492 400 412L310 260L413 259Q516 259 516 260Z"></path><path stroke-width="1" id="MJMAIN-2B" d="M56 237T56 250T70 270H369V420L370 570Q380 583 389 583Q402 583 409 568V270H707Q722 262 722 250T707 230H409V-68Q401 -82 391 -82H389H387Q375 -82 369 -68V230H70Q56 237 56 250Z"></path><path stroke-width="1" id="MJMAIN-2212" d="M84 237T84 250T98 270H679Q694 262 694 250T679 230H98Q84 237 84 250Z"></path></defs></svg>
Compare <span style="font-size: 100%; display: inline-block;" class="MathJax_SVG" id="MathJax-Element-1-Frame"><svg xmlns:xlink="http://www.w3.org/1999/xlink" width="3.254ex" height="2.509ex" style="vertical-align: -0.671ex;" viewBox="0 -791.3 1401 1080.4" role="img" focusable="false"><g stroke="currentColor" fill="currentColor" stroke-width="0" transform="matrix(1 0 0 -1 0 0)"><use x="0" y="0" xlink:href="#MJMATHI-41"></use><use transform="scale(0.707)" x="1061" y="-213" xlink:href="#MJMAIN-2B"></use></g></svg></span> and <span style="font-size: 100%; display: inline-block;" class="MathJax_SVG" id="MathJax-Element-2-Frame"><svg xmlns:xlink="http://www.w3.org/1999/xlink" width="3.254ex" height="2.509ex" style="vertical-align: -0.002ex;" viewBox="0 -791.3 1401 1080.4" role="img" focusable="false"><g stroke="currentColor" fill="currentColor" stroke-width="0" transform="matrix(1 0 0 -1 0 0)"><use x="0" y="0" xlink:href="#MJMATHI-41"></use><use transform="scale(0.707)" x="1061" y="-213" xlink:href="#MJMAIN-2212"></use></g></svg></span>.
</body></html>
dpvc commented 8 years ago

Thanks for the data file. It turns out that this was due to some issues with the font bounding box data, and that has been resolved in this pull request to MathJax itself. That hasn't been incorporated into a public release, but you could probably apply the font fixes to your local copy in mathjax-node.

dpvc commented 8 years ago

Alternatively, you could use something like \(A_{{\vphantom{+}}-}\) instead of \(A_{-}\). It is a hack, but it gets the positioning correct in the current version of mathjax-node with the current version of MathJax.

PatrickMassot commented 8 years ago

Thank you very much for investigating this. I don't mind using a development version of Mathjax, especially for server side rendering. I would still be interested if you have an estimated date of release of a version incorporating this fix though.

dpvc commented 8 years ago

We don't have a firm date, but I expect it will be within the next two months.

If you want to check out the develop branch of MathJax and replace the node_modules/mathjax directory with that (rename the old one in case you want it back), that branch includes the fix.

PatrickMassot commented 8 years ago

It works great, thank you very much.