MathJax in StackEdit.md

Markdown input

$$
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
$$

HTML output

<p><span class="MathJax_Preview"></span><div class="MathJax_Display" role="textbox" aria-readonly="true" style="text-align: center;"><span class="MathJax" id="MathJax-Element-11-Frame" style=""><nobr><span class="math" id="MathJax-Span-241" style="width: 12.215em; display: inline-block;"><span style="display: inline-block; position: relative; width: 9.853em; height: 0px; font-size: 124%;"><span style="position: absolute; clip: rect(0.637em 1000.003em 3.286em -0.516em); top: -2.186em; left: 0.003em;"><span class="mrow" id="MathJax-Span-242"><span class="mi" id="MathJax-Span-243" style="font-family: MathJax_Main;">Γ</span><span class="mo" id="MathJax-Span-244" style="font-family: MathJax_Main;">(</span><span class="mi" id="MathJax-Span-245" style="font-family: MathJax_Math; font-style: italic;">z<span style="display: inline-block; overflow: hidden; height: 1px; width: 0.003em;"></span></span><span class="mo" id="MathJax-Span-246" style="font-family: MathJax_Main;">)</span><span class="mo" id="MathJax-Span-247" style="font-family: MathJax_Main; padding-left: 0.291em;">=</span><span class="msubsup" id="MathJax-Span-248" style="padding-left: 0.291em;"><span style="display: inline-block; position: relative; width: 1.961em; height: 0px;"><span style="position: absolute; clip: rect(1.616em 1000.003em 4.208em -0.458em); top: -3.165em; left: 0.003em;"><span class="mo" id="MathJax-Span-249" style="font-family: MathJax_Size2; vertical-align: 0.003em;">∫<span style="display: inline-block; overflow: hidden; height: 1px; width: 0.406em;"></span></span><span style="display: inline-block; width: 0px; height: 3.171em;"></span></span><span style="position: absolute; clip: rect(1.731em 1000.003em 2.365em -0.458em); top: -3.281em; left: 1.213em;"><span class="mi" id="MathJax-Span-250" style="font-size: 70.7%; font-family: MathJax_Main;">∞</span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span><span style="position: absolute; clip: rect(1.558em 1000.003em 2.365em -0.516em); top: -1.264em; left: 0.637em;"><span class="mn" id="MathJax-Span-251" style="font-size: 70.7%; font-family: MathJax_Main;">0</span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span></span></span><span class="msubsup" id="MathJax-Span-252" style="padding-left: 0.176em;"><span style="display: inline-block; position: relative; width: 1.789em; height: 0px;"><span style="position: absolute; clip: rect(1.385em 1000.003em 2.365em -0.516em); top: -2.186em; left: 0.003em;"><span class="mi" id="MathJax-Span-253" style="font-family: MathJax_Math; font-style: italic;">t</span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span><span style="position: absolute; top: -2.589em; left: 0.406em;"><span class="texatom" id="MathJax-Span-254"><span class="mrow" id="MathJax-Span-255"><span class="mi" id="MathJax-Span-256" style="font-size: 70.7%; font-family: MathJax_Math; font-style: italic;">z<span style="display: inline-block; overflow: hidden; height: 1px; width: 0.003em;"></span></span><span class="mo" id="MathJax-Span-257" style="font-size: 70.7%; font-family: MathJax_Main;">−</span><span class="mn" id="MathJax-Span-258" style="font-size: 70.7%; font-family: MathJax_Main;">1</span></span></span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span></span></span><span class="msubsup" id="MathJax-Span-259"><span style="display: inline-block; position: relative; width: 1.328em; height: 0px;"><span style="position: absolute; clip: rect(1.558em 1000.003em 2.365em -0.458em); top: -2.186em; left: 0.003em;"><span class="mi" id="MathJax-Span-260" style="font-family: MathJax_Math; font-style: italic;">e</span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span><span style="position: absolute; top: -2.589em; left: 0.464em;"><span class="texatom" id="MathJax-Span-261"><span class="mrow" id="MathJax-Span-262"><span class="mo" id="MathJax-Span-263" style="font-size: 70.7%; font-family: MathJax_Main;">−</span><span class="mi" id="MathJax-Span-264" style="font-size: 70.7%; font-family: MathJax_Math; font-style: italic;">t</span></span></span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span></span></span><span class="mi" id="MathJax-Span-265" style="font-family: MathJax_Math; font-style: italic;">d<span style="display: inline-block; overflow: hidden; height: 1px; width: 0.003em;"></span></span><span class="mi" id="MathJax-Span-266" style="font-family: MathJax_Math; font-style: italic;">t</span><span class="mspace" id="MathJax-Span-267" style="height: 0.003em; vertical-align: 0.003em; width: 0.176em; display: inline-block; overflow: hidden;"></span><span class="mo" id="MathJax-Span-268" style="font-family: MathJax_Main;">.</span></span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span></span><span style="border-left-width: 0.004em; border-left-style: solid; display: inline-block; overflow: hidden; width: 0px; height: 3.004em; vertical-align: -1.211em;"></span></span></nobr></span></div><script type="math/tex; mode=display" id="MathJax-Element-11">
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
</script></p>

Template output:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>LaTex mathematical expressions</title>
<link rel="stylesheet" href="http://benweet.github.io/stackedit/css/main-min.css" />
<script type="text/javascript" src="http://benweet.github.io/stackedit/lib/MathJax/MathJax.js?config=TeX-AMS_HTML"></script>
</head>
<body><p><span class="MathJax_Preview"></span><div class="MathJax_Display" role="textbox" aria-readonly="true" style="text-align: center;"><span class="MathJax" id="MathJax-Element-11-Frame" style=""><nobr><span class="math" id="MathJax-Span-241" style="width: 12.215em; display: inline-block;"><span style="display: inline-block; position: relative; width: 9.853em; height: 0px; font-size: 124%;"><span style="position: absolute; clip: rect(0.637em 1000.003em 3.286em -0.516em); top: -2.186em; left: 0.003em;"><span class="mrow" id="MathJax-Span-242"><span class="mi" id="MathJax-Span-243" style="font-family: MathJax_Main;">Γ</span><span class="mo" id="MathJax-Span-244" style="font-family: MathJax_Main;">(</span><span class="mi" id="MathJax-Span-245" style="font-family: MathJax_Math; font-style: italic;">z<span style="display: inline-block; overflow: hidden; height: 1px; width: 0.003em;"></span></span><span class="mo" id="MathJax-Span-246" style="font-family: MathJax_Main;">)</span><span class="mo" id="MathJax-Span-247" style="font-family: MathJax_Main; padding-left: 0.291em;">=</span><span class="msubsup" id="MathJax-Span-248" style="padding-left: 0.291em;"><span style="display: inline-block; position: relative; width: 1.961em; height: 0px;"><span style="position: absolute; clip: rect(1.616em 1000.003em 4.208em -0.458em); top: -3.165em; left: 0.003em;"><span class="mo" id="MathJax-Span-249" style="font-family: MathJax_Size2; vertical-align: 0.003em;">∫<span style="display: inline-block; overflow: hidden; height: 1px; width: 0.406em;"></span></span><span style="display: inline-block; width: 0px; height: 3.171em;"></span></span><span style="position: absolute; clip: rect(1.731em 1000.003em 2.365em -0.458em); top: -3.281em; left: 1.213em;"><span class="mi" id="MathJax-Span-250" style="font-size: 70.7%; font-family: MathJax_Main;">∞</span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span><span style="position: absolute; clip: rect(1.558em 1000.003em 2.365em -0.516em); top: -1.264em; left: 0.637em;"><span class="mn" id="MathJax-Span-251" style="font-size: 70.7%; font-family: MathJax_Main;">0</span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span></span></span><span class="msubsup" id="MathJax-Span-252" style="padding-left: 0.176em;"><span style="display: inline-block; position: relative; width: 1.789em; height: 0px;"><span style="position: absolute; clip: rect(1.385em 1000.003em 2.365em -0.516em); top: -2.186em; left: 0.003em;"><span class="mi" id="MathJax-Span-253" style="font-family: MathJax_Math; font-style: italic;">t</span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span><span style="position: absolute; top: -2.589em; left: 0.406em;"><span class="texatom" id="MathJax-Span-254"><span class="mrow" id="MathJax-Span-255"><span class="mi" id="MathJax-Span-256" style="font-size: 70.7%; font-family: MathJax_Math; font-style: italic;">z<span style="display: inline-block; overflow: hidden; height: 1px; width: 0.003em;"></span></span><span class="mo" id="MathJax-Span-257" style="font-size: 70.7%; font-family: MathJax_Main;">−</span><span class="mn" id="MathJax-Span-258" style="font-size: 70.7%; font-family: MathJax_Main;">1</span></span></span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span></span></span><span class="msubsup" id="MathJax-Span-259"><span style="display: inline-block; position: relative; width: 1.328em; height: 0px;"><span style="position: absolute; clip: rect(1.558em 1000.003em 2.365em -0.458em); top: -2.186em; left: 0.003em;"><span class="mi" id="MathJax-Span-260" style="font-family: MathJax_Math; font-style: italic;">e</span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span><span style="position: absolute; top: -2.589em; left: 0.464em;"><span class="texatom" id="MathJax-Span-261"><span class="mrow" id="MathJax-Span-262"><span class="mo" id="MathJax-Span-263" style="font-size: 70.7%; font-family: MathJax_Main;">−</span><span class="mi" id="MathJax-Span-264" style="font-size: 70.7%; font-family: MathJax_Math; font-style: italic;">t</span></span></span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span></span></span><span class="mi" id="MathJax-Span-265" style="font-family: MathJax_Math; font-style: italic;">d<span style="display: inline-block; overflow: hidden; height: 1px; width: 0.003em;"></span></span><span class="mi" id="MathJax-Span-266" style="font-family: MathJax_Math; font-style: italic;">t</span><span class="mspace" id="MathJax-Span-267" style="height: 0.003em; vertical-align: 0.003em; width: 0.176em; display: inline-block; overflow: hidden;"></span><span class="mo" id="MathJax-Span-268" style="font-family: MathJax_Main;">.</span></span><span style="display: inline-block; width: 0px; height: 2.192em;"></span></span></span><span style="border-left-width: 0.004em; border-left-style: solid; display: inline-block; overflow: hidden; width: 0px; height: 3.004em; vertical-align: -1.211em;"></span></span></nobr></span></div><script type="math/tex; mode=display" id="MathJax-Element-11">
\Gamma(z) = \int_0^\infty t^{z-1}e^{-t}dt\,.
</script></p></body>
</html>

That makes sense. The "right" alternative would be MathML, I guess (as it's part of HTML5). Great project, btw!

@pkra I'm trying to implement a partial rendering on StackEdit, so that Markdown and MathJax is performed only on modified paragraphs. I actually have something working (more or less) but I noticed that to be really efficient, I have to disable MathJax rendering on MathJax elements that are already converted . So I put something like that in my code before the typeset:

$('script[type="math/tex; mode=display"]').remove();

But I don't really like to remove these scripts. I was wandering if there was a way to tell MathJax to ignore them?

Thanks in advance.

Ok, I don't remember how you synchronize with MathJax. If you're using MathJax.Hub.Queue(["Typeset",MathJax.Hub]); , then MathJax shouldn't re-render elements that it has rendered already ("Rerender" does that, see http://docs.mathjax.org/en/latest/typeset.html. But it's still inefficient in that it checks the entire page for new math. You can specify DOM elements to have MathJax typeset only within them.

Regarding "prevention", there's the ignoreClass configuration option from the TeX preprocessor, see http://docs.mathjax.org/en/latest/options/tex2jax.html

Does that help?