Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

LaTeX Strings in plotly lead to javascript error. #1500

Open
j-fu opened this issue Sep 25, 2021 · 4 comments
Open

LaTeX Strings in plotly lead to javascript error. #1500

j-fu opened this issue Sep 25, 2021 · 4 comments
Labels
publishing Notebooks as static documents on the web

Comments

@j-fu
Copy link
Contributor

j-fu commented Sep 25, 2021

Hi, using LaTeX strings in plotly.js leads to the following javascript error with MathJax setup:

SetupMathJax.js:17 Uncaught (in promise) TypeError: window.MathJax.Callback is not a function
    at Object.Queue (SetupMathJax.js:17)
    at plotly-1.58.4.min.js:61
    at plotly-1.58.4.min.js:61
    at new Promise (<anonymous>)
   ...

An MWE in form of a pluto notebook can be found here:

plotly-mathjax-mwe.jl

The same error appears in the Plot.jl sample notebook when using LaTeXStrings
and plotting with plot!(years, oranges, label=L"$x^3$".s)

@fonsp
Copy link
Owner

fonsp commented Oct 6, 2021

The problem is that plotly uses MathJax 2, but we are using MathJax 3, and because MathJax does not provide an ES module export, we can only use one version at the same time on one page :(

@j-fu
Copy link
Contributor Author

j-fu commented Oct 7, 2021

It seems that the problem is known over there: plotly/plotly.js#4563

@j-fu
Copy link
Contributor Author

j-fu commented Dec 26, 2021

FYI: plotly/plotly.js#6073

@disberd
Copy link
Contributor

disberd commented Mar 21, 2022

I was trying to make recent plotly work in Pluto with latex given the recent support to MathJax 3.
Unlike before, now the plot appears correctly if using a version of Plotly > 2.10, but latex still does not display where it's supposed to:
image

It does seem that there is some issue with the global MathJax fontCache.

equations that are rendered before the plot is loaded are correctly rendered also in the plot, but loading the plotly plot then breaks rendering of new symbols even outside of plotly plots (If you try to change the latextring in the cell below to some latex other latex glyph after rendering the plot you get an empty SVG).

image

Finally, it seems that commenting out these lines:

svg: {
fontCache: "global",
},

fix the latex rendering issues with plotly.

I have seen that the plan might be to migrate to KaTeX directly as in #1998 but I am still tagging @fonsp as he might understand more about this fontCache problem 😄

Edit: Adding the notebook code

# ╔═╡ 89c83fb6-26a2-466f-bec4-399eceef6070
using LaTeXStrings

# ╔═╡ d65eea4b-da9e-48f0-9763-103cadca0a92
L"$\Psi = 3"

# ╔═╡ 6e3ef160-a833-11ec-0086-973be8405af3
html"""
<div id='graph'>
</div>
  <script src="https://cdn.plot.ly/plotly-2.11.1.js"></script>
<script>
Plotly.newPlot('graph', [{
  y: [2,1,2],
	name: '$\\sigma = 3$',
showlegend: true,
}], {
  title: '$\\Psi=3$'
})
</script>
"""

@fonsp fonsp added the publishing Notebooks as static documents on the web label Oct 30, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
publishing Notebooks as static documents on the web
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants