LaTeX integration

[jstac]

Just so you have the satisfaction of closing an issue when this is done.

[sglyon]

53516aa got this working in Electron.

I just realized that it has been working in the notebook all along, with one caveat: it doesn't work in Chrome.

For some reason Chrome complains with the following in the console:

As I'm not a web-tech guru, I don't really know how to get around this. Otherwise I think we are very close to closing this one

[jstac]

@DrDrij might be willing to help you on this one.

[sglyon]

cc @DrDrij any idea how to overcome this "can't load a font" issue?

[DrDrij]

Sure thing. Are you running this locally or is there a URL I can load for context?
From the error message it appears an attempt has been made to load the font resource from a different domain (localhost) to where the attempt was called from.

[sglyon]

@mmcky do we have any instances of tempnb or something like that I can prep for @DrDrij here?

[mmcky]

@spencerlyon2 Sorry for my slow response. I have been away.
I have some old tmpnb instances that we could update with PlotlyJS?

[sglyon]

@mmcky no problem -- I hope you've been able to do something fun.

tempnb would be great, how can we do it? Do you need anything from me?

[jebej]

I can confirm that latex still does not work in IJulia on chrome (I tried on Edge but there the plot does not render at all) and works in electron.

[BoundaryValueProblems]

I just want to report that not only IJulia, but also simple REPL sessions and Juno/Atom sessions, LaTeXStrings do not work properly with PlotlyJS (although I am using PlotlyJS backend in Plots.jl). Here is a simple example (using Plots.jl):

using Plots, LaTeXStrings
plotlyjs()
scatter(rand(10), ms = 20, series_annotations = [text(latexstring("\\phi_", "{$i}"), 14, :white) for i in 1:10], label="", marker_z=0:9)

Perhaps, one could convert the above to pure PlotlyJS functions, but I doubt those would work properly. It would be really great if LaTeXStrings are fully integrated into PlotlyJS. Note that LaTeXStrings work well with PyPlot.
Thanks!
BVPs

[sglyon]

Hi @BoundaryValueProblems , what would

LaTeXStrings are fully integrated into PlotlyJS

look like to you?

Right now I do utilize LaTeXStrings in PlotlyJS.jl (see these lines) and re-export the L" string macros. Perhaps I should also re-export the latexstring function?

Here's an example of how this currently works in PlotlyJS:

plot([scatter(y=rand(10), name=latexstring("\\phi_", i)) for i in 1:3])

[BoundaryValueProblems]

Hi, @sglyon . Thank you for your reply!
I'm hesitant to agree with "LaTeXStrings are fully integrated into PlotlyJS" at this point.
I ran your example with just PlotlyJS, not using Plots.jl. It worked partially. For example, the legends correctly showed those symbols when I used REPL from a terminal. But using Juno/Atom, they were not displayed. Also, in both REPL from a terminal and Juno/Atom, when I traced those curves with a cursor, the curve labels at those plotted data points were not rendered correctly: they were displayed as, e.g., 0.799105$\phi_2$, etc.

[sglyon]

So the LaTexStrings.jl package is very small (the entire package is in one file): it simply defines a LaTeXString type that adds some $ to the front and back of a string and defines methods to make this LaTeXString act like a string. There really isn't much to do to "integrate" it with the package as all it does is provide this type.

I think the issues you are seeing are actually with the plotly.js javascript library used to render plots. When I go to this page in the plotly.js docs, the plot doesn't load properly (or takes a very long time to load). If I look at my browser's javascript console I see a bunch of errors:

I have verified that LaTeX isn't working in atom/juno. Not sure why, I think @MikeInnes or @pfitzseb would have to chip in here on why MathJAX rendering in the plot pane isn't working

[pfitzseb]

I see an additional error in Juno:

Uncaught TypeError: Cannot read property 'legend' of undefined

which is thrown from inside the webview that contains the plot. Not sure what's going on there tbh.

When opening the PlotlyJS page linked above I also get

downloadable font: kern: Too large subtable (font-family: "Open Sans" style:normal weight:normal stretch:normal src index:0) source: https://plot.ly/static/fonts/OpenSans/OpenSans-Regular.629a55a7e793.ttf  4836deb164f3.css:1:2355
downloadable font: Table discarded (font-family: "Open Sans" style:normal weight:normal stretch:normal src index:0) source: https://plot.ly/static/fonts/OpenSans/OpenSans-Regular.629a55a7e793.ttf  4836deb164f3.css:1:2355

and no latex legend entries.

So yeah, kinda strange all in all...

[Gregstrq]

Has there been any progrees since then?
When I try to use L"..." in jupyter notebook with plotlyjs, the LaTeXString part is not rendered, while the rest of the plot is.

[sglyon]

Hmm, that's unfortunate. I have not focused specifically on this issue.

We are nearly finished with a re-write of the display backend, which may resolve this issue

[otobrzo]

I really love, the PlotlyJS.jl package, the only thing i need to solve is the latex integration.
Following code gives me

using PlotlyJS
using LaTeXStrings

plot([scatter(y=rand(10), name=latexstring("\\phi_", i)) for i in 1:3])

The screenshot is from vscode plot pane but the same a I get from electron window.
In Jupyterlab, the legend text is empty.

Should I install MathJax or any other package to get the integration working?

[otobrzo]

I am wondering if this

https://github.com/plotly/plotly.js/blob/master/dist/README.md#to-support-mathjax

can be somehow related to this issue.

[jtschneider]

Could the PR above solve this issue? Or are there new developments that would retard the integration of #331 ?

[sglyon]

Thanks @jtschneider for the ping.

I don't know much about the AssetRegistry package used in #331. My (uninformed!) guess is that the PR should probably be updated to use the Pkg.Artifacts system instead?

[VivaldoMendes]

I think it is a pity that such a remarkable package like PlotlyJS.jl does not support LaTeX code. In the Julia world, PlotlyJS is second to none in terms of display quality and interactivity. There are circumstances in which we can deal without LaTeX when plotting, but others (for example, teaching materials) are difficult to do without it. I am a user, so that I can be of little help. If somehow, allowing LaTeX to be used in the label of axis and variables, that would be enough for most users of PlotlyJS. By the way, I tried the suggestions by #331 , but they did not work.

[otobrzo]

If you export your figure to html and then add (after downloading mathjax to local)

         <script src="mathjax/MathJax.js?config=TeX-AMS-MML_SVG"></script>
         <script>
            window.PlotlyConfig = {MathJaxConfig: 'local'}
         </script>

to the head section of your html then you should have latex rendering.

But how to do it automatically and for other formats?

[ziyuang]

There is a section in the documentation on how to add the MathJax header, which doesn't really work at least from my side.