LaTeX not rendering in Plotly figures

stephteo commented 2 years ago

Environment data

VS Code version: 1.61.2
Jupyter Extension version (available under the Extensions sidebar): v2021.9.1101343141
Python Extension version (available under the Extensions sidebar): v2021.10.1365161279
OS (Windows | Mac | Linux distro) and version: Mac Big Sur Version 11.6
Python and/or Anaconda version: Python 3.9.7
Type of virtual environment used (N/A | venv | virtualenv | conda | ...): XXX
Jupyter server running: Tried both Local and Remote
Plotly version: 4.14.3

Expected behaviour

Successfully have LaTeX render in Plotly figures when running on either Jupyter Notebook or JupyterLab from a Chrome browser (Version 95.0.4638.54). Tested this with the examples directly from Plotly: https://plotly.com/python/LaTeX/

import plotly.express as px

fig = px.line(x=[1, 2, 3, 4], y=[1, 4, 9, 16], title=r'$\alpha_{1c} = 352 \pm 11 \text{ km s}^{-1}$')
fig.update_layout(
    xaxis_title=r'$\sqrt{(n_\text{c}(t|{T_\text{early}}))}$',
    yaxis_title=r'$d, r \text{ (solar radius)}$'
)
fig.show()

import plotly.graph_objs as go

fig = go.Figure()
fig.add_trace(go.Scatter(
    x=[1, 2, 3, 4],
    y=[1, 4, 9, 16],
    name=r'$\alpha_{1c} = 352 \pm 11 \text{ km s}^{-1}$'
))
fig.add_trace(go.Scatter(
    x=[1, 2, 3, 4],
    y=[0.5, 2, 4.5, 8],
    name=r'$\beta_{1c} = 25 \pm 11 \text{ km s}^{-1}$'
))
fig.update_layout(
    xaxis_title=r'$\sqrt{(n_\text{c}(t|{T_\text{early}}))}$',
    yaxis_title=r'$d, r \text{ (solar radius)}$'
)
fig.show()

Note: Using Chrome because there is a bug in Firefox that prevents proper rendering of Plotly figures with Mathjax (https://github.com/plotly/plotly.js/pull/5993)

It looks like this may be related to this issue: https://github.com/microsoft/vscode-jupyter/issues/6802 since you can wrap the above figure in Plotly FigureWidget:

f = go.FigureWidget(fig)
f.show()

Actual behaviour

No LaTeX rendering when using the same Jupyter notebook in VS Code.

Steps to reproduce:

Simply run any of the above code in VS Code with the same environment as listed above.

rchiodo commented 2 years ago

Thanks for the bug. Related issue #7801

DonJayamanne commented 2 years ago

Duplicate of https://github.com/microsoft/vscode-jupyter/issues/7801

amunger commented 1 year ago

re-opening this since it has a good explanation of the remaining issue - that latex doesn't render within plotly widgets

tomas-mazak commented 1 year ago

Hi all, I have the same issue, but seeing exactly the same using Jupyter Lab as well. Did a little bit of digging, and found this plotly issue: https://github.com/plotly/plotly.py/issues/515

Based on the discussion there, I've put together this workaround, that seems to work in VSCode as well:

import plotly
from IPython.display import display, HTML

plotly.offline.init_notebook_mode()
display(HTML(
    '<script type="text/javascript" async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.1/MathJax.js?config=TeX-MML-AM_SVG"></script>'
))

janosh commented 11 months ago

@tomas-mazak Thanks for the workaround!

Would be great if this issue could be revisited so plotly LaTeX labels in VS Code work out of the box. Thanks!

mfouesneau commented 2 weeks ago

This fix the title but removes the rest of the labels for me.

microsoft / vscode-jupyter