PlotlyJS.jl icon indicating copy to clipboard operation
PlotlyJS.jl copied to clipboard

LaTeX integration

Open jstac opened this issue 7 years ago • 22 comments

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

jstac avatar Jul 24 '16 12:07 jstac

53516aa0e17a89d09a404bda11c4337d79443b3b 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:

screen shot 2016-07-29 at 12 01 54 am

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

sglyon avatar Jul 28 '16 23:07 sglyon

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

jstac avatar Jul 29 '16 14:07 jstac

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

sglyon avatar Aug 23 '16 22:08 sglyon

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.

DrDrij avatar Aug 24 '16 15:08 DrDrij

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

sglyon avatar Aug 24 '16 15:08 sglyon

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

mmcky avatar Aug 27 '16 10:08 mmcky

@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?

sglyon avatar Aug 27 '16 21:08 sglyon

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.

jebej avatar Apr 24 '17 13:04 jebej

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

BoundaryValueProblems avatar Nov 05 '17 23:11 BoundaryValueProblems

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])

sglyon avatar Nov 06 '17 17:11 sglyon

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.

BoundaryValueProblems avatar Nov 06 '17 20:11 BoundaryValueProblems

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:

screen shot 2017-11-06 at 3 27 08 pm

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

sglyon avatar Nov 06 '17 20:11 sglyon

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...

pfitzseb avatar Nov 07 '17 10:11 pfitzseb

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.

Gregstrq avatar Aug 22 '18 12:08 Gregstrq

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

sglyon avatar Aug 29 '18 11:08 sglyon

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])

Screenshot_20190430_074431

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 avatar Apr 22 '19 16:04 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.

otobrzo avatar Feb 14 '20 15:02 otobrzo

Could the PR above solve this issue? Or are there new developments that would retard the integration of https://github.com/JuliaPlots/PlotlyJS.jl/pull/331 ?

jtschneider avatar Apr 30 '21 10:04 jtschneider

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?

sglyon avatar Apr 30 '21 13:04 sglyon

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.

VivaldoMendes avatar May 11 '21 19:05 VivaldoMendes

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?

otobrzo avatar Jul 22 '21 06:07 otobrzo

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

ziyuang avatar Oct 29 '21 00:10 ziyuang