I’ve written some code that places nicely typeset labels in an SVG using KaTeX and SVG’s
foreignObject element. I’ve got a couple of versions of a cycloid with the tick labels written as integer multiples of
- An old school version where the cycloid interactive and slider controls in a single HTML container and
- a newer version where the interactive sliders are generated with the
viewofoperator and placed in separate cells.
The old school version works as expected in all browsers that I’ve tried.
The newer version has issues that manifest differently in Firefox and Chrome. In Firefox, the typeset tick labels appear twice. The second tick label looks like a lower quality fallback as shown in the image below. In Chrome, the labels also appear twice, once as a non-typeset TeX string and once as a crummy looking fallback. As far as I can tell, KaTeX is not generating any errors.
I’m not really sure exactly what’s going on here but I will say that I don’t have a lot of experience dealing with generators. I’d appreciate feedback on the new version that anyone has.