katex in svg labels

[e-carlin]

Investigate using katex for rendering in svg labels.

[e-carlin]

Maybe look into https://university.webflow.com/integrations/mathjax. The problem is making sure that the labels are present in the downloadable png

[moellep]

It does look like MathJax does this well out-of-the box: https://viereck.ch/latex-to-svg/ I tried a few of the more complicated formulas we are using with KaTeX, and it rendered the same, except in svg.

[moellep]

I found the html2canvas library does both html and svg and can render KaTeX math as well. And it is as easy as supplying the element and receiving a canvas:

    html2canvas(el).then(canvas => {
        ....
    });

[moellep]

This issue is important for plot improvements. I'll take a look. I found the png download was displaying the 2 different renderings of the label, so the code below hides the katex-html version.

         html2canvas(el, {
             scale: outputHeight / $(el).height(),
             backgroundColor: '#ffffff',
             ignoreElements: (element) => {
                 return element.matches("path.pointer.axis") || element.classList.contains('katex-html');
             }
         }).

Also, the global css doesn't make it into the foreignObject, so the label css needs to get added to the svg within a style tag.

[moellep]

This was implemented for parameterPlots with 59b71d0, but should be expanded to include plot3d and heatmaps.