How do I pass SVG through port?

Learn
1

Hi,

I’m trying to use MathJax to convert a String (with valid TeX code) into a data structure I can attach event handlers / change the attributes of. In theory this should be easy, given that MathJax has a function MathJax.tex2svg which does exactly that. The only issue is that the output is in JS. The following code will render nicely formatted maths to the screen

let svg = MathJax.tex2svg(texString, { em: 12, ex: 6, display: false });
document.body.appendChild(svg);
let mathJaxStyleSheet = MathJax.svgStylesheet();
document.head.appendChild(mathJaxStyleSheet);

And will even work if, instead of using svg, I use a new div with only the innerHTML of said div set to the innerHTML of svg.

From my understanding, this should mean that sending the innerHTML through a port to Elm then using SvgParser.parse successfully should render properly no? But instead I get

image

When it should look like a well typeset 2π.

Thanks for reading- any and all criticism/advice is welcome!

You might find this page helpful-
https://docs.mathjax.org/en/latest/web/typeset.html#converting-a-math-string-to-other-formats

2

Found the issue- the output SVG text was using the deprecated xlink:href instead of href. Removing that makes it work. Confusing as to why it works at all through JS though.

3

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.