LaTeX/Mathjax example

[avivajpeyi]

Hey @mwouts , me again 😅

I was wondering -- do you have any suggestions on rendering latex / mathjax in tables?

I followed the suggestion proposed in this stack-overflow: https://stackoverflow.com/questions/35864810/mathjax-render-only-on-first-page-of-the-data-table

Here is what I was testing out:

import pandas as pd
from itables import init_notebook_mode, show
import itables.options as opt


opt.css = """
$('#example').DataTable( { "drawCallback": function( settings ) { MathJax.Hub.Queue(["Typeset",MathJax.Hub]); } } );
"""


init_notebook_mode(all_interactive=True)


df = pd.DataFrame({
    "$N_{\\text{event}}$": ["$\\alpha$", "$\\beta$", "$\\gamma$"]*10,
    "Value": ["$0.8_{-0.1}^{+0.3}$","$3.2_{-0.4}^{+0.2}$", "$-0.1_{-0.5}^{+0.8}$"]*10
})

show(df)

[mwouts]

Great question. Thank you for asking. I don't find much references on this, only https://stackoverflow.com/questions/35864810/mathjax-render-only-on-first-page-of-the-data-table.

As this requires another JS library this might be a bit difficult to get it to work. You can still give a try - add a drawCallback = JavaScriptFunction(...) argument to the show function as in this example.

[mwouts]

This seems to work in Jupyter Notebook:

import pandas as pd
from itables import init_notebook_mode, JavascriptFunction
import itables.options as opt


opt.drawCallback = JavascriptFunction(
    "function(settings) " '{MathJax.Hub.Queue(["Typeset",MathJax.Hub]);}'
)

init_notebook_mode(all_interactive=True)

pd.DataFrame(
            {
                "$N_{\\text{event}}$": ["$\\alpha$", "$\\beta$", "$\\gamma$"],
                "Value": [
                    "$0.8_{-0.1}^{+0.3}$",
                    "$3.2_{-0.4}^{+0.2}$",
                    "$-0.1_{-0.5}^{+0.8}$",
                ],
            }
        )

However, it does not work in VS Code nor in Jupyter Book. Reguarding Jupyter Book I find this: jupyter-book/jupyter-book#1212, which seem to mean that we will have to load MathJax explicitely. I will see what I can do in the coming days.

[avivajpeyi]

Cool! Thanks -- BTW i tested out adding the following to my jupyter-book configs:

sphinx:
  config:
    mathjax_path: https://mathjax.rstudio.com/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML
    mathjax_config:
      tex2jax:
        inlineMath: [["$", "$"], ["\\(", "\\)"]]
    myst_update_mathjax: false

But this unfortunately did not fix the issue

[avivajpeyi]

Hey @mwouts -- any thoughts on this? Or if you could suggest what I'd need to change to make a PR for this, that'd be awesome!

[mwouts]

Hey @choldgraf, how are you? I was wondering if you could provide some guidance to get this to work in Jupyter Book?

I think a simple and representative example of what I would like to do, is to render this html file in Jupyter Book.

The file seems to work standalone. Now, do I need to do any configuration in Jupyter Book? We have seen this section of the JP documentation, but since I do include MathJax in the HTML file, do we need to do any of that?

[avivajpeyi]

Ping @choldgraf

[avivajpeyi]

Hey @mwouts, thanks again for working on this!

Do you have any suggestions for a temporary workaround the Latex+jupyter-book+itables issue?
Could I maybe either:

1. edit the raw jupyer-book generated HTML to make itables + latex work?
2. maybe insert an itable + latex iframe into jupyter book?

Right now the latex issue stands out on our table:
https://cjhaster.com/NRSurrogateCatalog/events/gw_menu_page.html

Thanks again for this awesome tool :)