Search code examples
pythonplotly-dashcdnmathjax

Plotly Dash figure only renders LaTeX with MathJax v2, markdown only renders LaTeX with MathJax v3

Context: developing scientific dashboard and need LaTeX to render in both graphs and text.

Summary of the problem:

  • dcc.Markdown only works with MathJax v3.2 and not v2 (see dash documentation)
  • dcc.Figure only works with MathJax v2 and not v3.2. (I don't know why)

Here are the versions of the libraries if relevant:

>>> plotly.__version__
'5.11.0'
>>> dash.__version__
'2.7.0'

According to the Plotly Documentation, better support for MathJax v3 should already exist for version 5.8.0.

The CDNs I have tried:

from dash import Dash

# v2
MATHJAX_CDN = "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-MML-AM_CHTML"

# v3
MATHJAX_CDN = 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/3.2.0/es5/tex-mml-chtml.js'

app = Dash(__name__, external_scripts=[MATHJAX_CDN])

As mentioned above, with v2: dcc.Figure renders LaTeX with mathjax=True. dcc.Markdown does not.

With v3: dcc.Markdown renders LaTeX with mathjax=True. dcc.Figure does not.

How do I reconcile this issue?

  • Is there a CDN link I can use for which BOTH figures AND markdown will render LaTeX?
  • Is the reason why it's not working something to do with es5 or AM_CHTML which are unique to each imported CDN?

Edit:

I have also tried creating a fresh environment with up-to-date versions of both plotly (5.13.1) and dash (2.9.0). Same problem.

Solution

  • Turns out it's a simple matter of just NOT manually loading a MATHJAX_CDN into external_scripts at all.

    So instead of this:

    from dash import Dash

# v2
MATHJAX_CDN = "https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.4/MathJax.js?config=TeX-MML-AM_CHTML"

# v3
MATHJAX_CDN = 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/3.2.0/es5/tex-mml-chtml.js'

app = Dash(__name__, external_scripts=[MATHJAX_CDN])

    Do this instead:

    from dash import Dash

app = Dash(__name__)

    and just add mathjax=True to dcc.Figure and dcc.Markdown as normal.

    Keeping in mind I did this with the newer fresh python environment; haven't checked this for the older versions I'd previously specified.

    Source here