GiovineItalia / Compose.jl

Declarative vector graphics
http://giovineitalia.github.io/Compose.jl/latest/
Other
248 stars 83 forks source link

new mathjax support, requires JS #418

Closed GiggleLiu closed 3 years ago

GiggleLiu commented 3 years ago

List of changes

MathJax support when rendering SVG in a browser

It works directly in Pluto notebooks.

compose(context(), mathjax(0.2, 0.2, 0.1, 0.1, "x+1\\over y-1"), fontsize(12pt))

image

If not using a Pluto notebook, one needs to add the following javascript in the HTML header

<script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_SVG"></script>

Allowing inserting Raw SVG elements

I feel this provides flexibility to make an extension. Although most people do not need this. For example, the following code also renders the Mathjax

compose(context(), rawsvg(raw"""<foreignObject x="50" y="50" width="100" height="100">
    <div xmlns="http://www.w3.org/1999/xhtml" style="font-family:Times; font-size:15px">
        \(\displaystyle{x+1\over y-1}\)
    </div>
  </foreignObject>"""))

Notes

Please review this PR carefully because I am not quite familiar with Compose API.

Reference: https://stackoverflow.com/questions/15962325/mathjax-inside-svg#:~:text=Currently%2C%20the%20only%20way%20to,'t%20support%20.

GiggleLiu commented 3 years ago

I find a possible issue, the viewBox is too large for the latex to render correctly sometime. Because MathJax has a minimum superscript/subscript size.

image

GiggleLiu commented 3 years ago

I feel this kind of rendering is not perfect. Maybe not a good fit for this package.