Block problem when Math rendering (MathJax) #698

Closed
opened 2026-01-29 14:43:14 +00:00 by claunia · 7 comments
Owner

Originally created by @KaiDeMori on GitHub (Sep 4, 2024).

Good day! And thank you for this great libary. I have been using it for years now 🤗

At the moment, I am struggling to get math rendering to work.

The lines I seek to render are using the \[mathgoeshere\] notation like this:

\[ \gamma = \frac{1}{\sqrt{1 - \frac{v^2}{c^2}}} \]

If I simply put it in a HTML file with MathJax (see attached example) it works fine.

But when I try to use it in a markdig generated HTML page, it doesnt work. The \ in front of the []s are missing and the v^2 gets rendered as <sup>, which I guess must confuse MathJax.

I can't use the $$ notation and all the .md files I have already use the square brackets blocks.

I am normally using many extensions, but I removed all of them for now (for testing the math).
Without any extensions loaded, it works perfectly if I add an additional backslash in front of the block brackets \\[texgoeshere\\]

Although there seems to be ways to "fix" this, my question is how it is supposed to work. Like: What is the intended way of doing math?

I couldn't find real examples or a tutorial and would be happy to write some explanation for the docs, when I get it to work.

Of course it would be an honor to answer any questions, as I might not have been able to present the problem in best manner. Please forgive me.

I have read these other related topics:
#259
#307
and have read the pull request
#311

I thought the latter one should support my intended use-case 🤔

These are the extensions I usually load:

      var pipeline = new MarkdownPipelineBuilder()
         .UseAdvancedExtensions()
         .UseEmojiAndSmiley()
         .UseEmphasisExtras()
         .UseSmartyPants()
         .DisableHtml()
         .UseSoftlineBreakAsHardlineBreak()
         .Build();

I don't mind switching to a different math-rendering library, if that's the cause. I am looking for the cleanest solution.

Please have a wonderful time everyone and thanks again for the amazing code!

math_trials.zip

Originally created by @KaiDeMori on GitHub (Sep 4, 2024). Good day! And thank you for this great libary. I have been using it for years now 🤗 At the moment, I am struggling to get math rendering to work. The lines I seek to render are using the `\[mathgoeshere\]` notation like this: ``` \[ \gamma = \frac{1}{\sqrt{1 - \frac{v^2}{c^2}}} \] ``` If I simply put it in a HTML file with MathJax (see attached example) it works fine. But when I try to use it in a markdig generated HTML page, it doesnt work. The `\` in front of the `[]`s are missing and the `v^2` gets rendered as `<sup>`, which I guess must confuse MathJax. I can't use the $$ notation and all the `.md` files I have already use the square brackets blocks. I am normally using many extensions, but I removed all of them for now (for testing the math). Without any extensions loaded, it works perfectly if I add an additional backslash in front of the block brackets `\\[texgoeshere\\]` Although there seems to be ways to "fix" this, my question is how it is supposed to work. Like: What is the intended way of doing math? I couldn't find real examples or a tutorial and would be happy to write some explanation for the docs, when I get it to work. Of course it would be an honor to answer any questions, as I might not have been able to present the problem in best manner. Please forgive me. I have read these other related topics: #259 #307 and have read the pull request #311 I thought the latter one should support my intended use-case 🤔 These are the extensions I usually load: ``` var pipeline = new MarkdownPipelineBuilder() .UseAdvancedExtensions() .UseEmojiAndSmiley() .UseEmphasisExtras() .UseSmartyPants() .DisableHtml() .UseSoftlineBreakAsHardlineBreak() .Build(); ``` I don't mind switching to a different math-rendering library, if that's the cause. I am looking for the cleanest solution. Please have a wonderful time everyone and thanks again for the amazing code! [math_trials.zip](https://github.com/user-attachments/files/16869736/math_trials.zip)
claunia added the question label 2026-01-29 14:43:14 +00:00
Author
Owner

@xoofx commented on GitHub (Sep 4, 2024):

I can't use the $$ notation and all the .md files I have already use the square brackets blocks.

Markdig does not support math without $$ and #311 still expects wrapping $$ or $. The changes in this PR added escaped brackets in and out.

Check this example on babelmark that is correctly using $$ and the Markdown implementation supporting Math are correctly handling it.

While apart maruku-math, none are supporting without $$ (here)

@xoofx commented on GitHub (Sep 4, 2024): > I can't use the $$ notation and all the .md files I have already use the square brackets blocks. Markdig does not support math without `$$` and #311 still expects wrapping `$$` or `$`. The changes in this PR added escaped brackets in and out. Check this example on [babelmark](https://babelmark.github.io/?text=%24%24%5Cgamma+%3D+%5Cfrac%7B1%7D%7B%5Csqrt%7B1+-+%5Cfrac%7Bv%5E2%7D%7Bc%5E2%7D%7D%7D%24%24) that is correctly using `$$` and the Markdown implementation supporting Math are correctly handling it. While apart maruku-math, none are supporting without `$$` ([here](https://babelmark.github.io/?text=%5C%5B+%5Cgamma+%3D+%5Cfrac%7B1%7D%7B%5Csqrt%7B1+-+%5Cfrac%7Bv%5E2%7D%7Bc%5E2%7D%7D%7D+%5C%5D))
Author
Owner

@KaiDeMori commented on GitHub (Sep 4, 2024):

Thank you so much for the answer! I know now what to do.
BTW, babelmarkIII is a fantastic site. I didn't know that one yet. Thx!

@KaiDeMori commented on GitHub (Sep 4, 2024): Thank you so much for the answer! I know now what to do. BTW, [babelmarkIII](https://babelmark.github.io/) is a fantastic site. I didn't know that one yet. Thx!
Author
Owner

@KaiDeMori commented on GitHub (Sep 4, 2024):

Sorry, just want to understand something:

Check this example on babelmark that is correctly using $$ and the Markdown implementation supporting Math are correctly handling it.

The example doesn't work for me and only shows a formula for maruku. Should it also work on other implementations? What could I be doing wrong?

@KaiDeMori commented on GitHub (Sep 4, 2024): Sorry, just want to understand something: > Check this example on [babelmark](https://babelmark.github.io/?text=%24%24%5Cgamma+%3D+%5Cfrac%7B1%7D%7B%5Csqrt%7B1+-+%5Cfrac%7Bv%5E2%7D%7Bc%5E2%7D%7D%7D%24%24) that is correctly using `$$` and the Markdown implementation supporting Math are correctly handling it. The example doesn't work for me and only shows a formula for maruku. Should it also work on other implementations? What could I be doing wrong?
Author
Owner

@xoofx commented on GitHub (Sep 5, 2024):

The example doesn't work for me and only shows a formula for maruku. Should it also work on other implementations? What could I be doing wrong?

In Markdig and most Markdown implementations, a math code block:

$$\gamma = \frac{1}{\sqrt{1 - \frac{v^2}{c^2}}}$$

will generate the following HTML fragment:

<p>
  <span class="math">
    \(\gamma = \frac{1}{\sqrt{1 - \frac{v^2}{c^2}}}\)
  </span>
</p>

It is then up to your final HTML page composition to integrate your Math JS library of choice to format these blocks correctly. Markdig today does not support rendering directly to e.g MathML

@xoofx commented on GitHub (Sep 5, 2024): > The example doesn't work for me and only shows a formula for maruku. Should it also work on other implementations? What could I be doing wrong? In Markdig and most Markdown implementations, a math code block: ```md $$\gamma = \frac{1}{\sqrt{1 - \frac{v^2}{c^2}}}$$ ``` will generate the following HTML fragment: ```html <p> <span class="math"> \(\gamma = \frac{1}{\sqrt{1 - \frac{v^2}{c^2}}}\) </span> </p> ``` It is then up to your final HTML page composition to integrate your Math JS library of choice to format these blocks correctly. Markdig today does not support rendering directly to e.g [MathML](https://www.w3.org/TR/MathML3/)
Author
Owner

@KaiDeMori commented on GitHub (Sep 5, 2024):

I think I finally get it now. 🙈
Thanks for the patience and taking the time! 🙏

@KaiDeMori commented on GitHub (Sep 5, 2024): I think I finally get it now. 🙈 Thanks for the patience and taking the time! 🙏
Author
Owner

@JaneConan commented on GitHub (Mar 3, 2025):

So how can we show the right Math, just Replace("\[", "$") and Replace("\\]", "$") ?

It's not look right in the final HTML page🤔

@JaneConan commented on GitHub (Mar 3, 2025): So how can we show the right Math, just Replace("\\[", "$$") and Replace("\\]", "$$") ? It's not look right in the final HTML page🤔
Author
Owner

@KaiDeMori commented on GitHub (Mar 24, 2025):

@JaneConan Not sure what you mean. I use the $$ notation now in combination with MathJAX (the tex-mml-chtml version).
But the whole pipeline is of course a little more complicated (Prism et al. 😉 )
Maybe you should open a new issue and explain more there. I would be glad to help.

@KaiDeMori commented on GitHub (Mar 24, 2025): @JaneConan Not sure what you mean. I use the `$$` notation now in combination with **MathJAX** (the `tex-mml-chtml` version). But the whole pipeline is of course a little more complicated (Prism et al. 😉 ) Maybe you should open a new issue and explain more there. I would be glad to help.
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: starred/markdig#698