How do you add MathJax?

Anvil Q&A
4

I’m creating a very basic custom component that contains one property in which a TeX string may be entered and rendered at runtime. Here is the code in its current form:

from ._anvil_designer import TeXTemplate
from anvil import *
import anvil.server

class TeX(TeXTemplate):
  mathjax_script='<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script><script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js"> </script>'
  def __init__(self, **properties):
    self.init_components(**properties)

  @property
  def tex(self):
    print(f"Getting tex: {self._tex}")
    return self._tex

  @tex.setter
  def tex(self, value):
    print(f"Setting tex: {value}")
    self._tex = value
    self.html = self.mathjax_script + '<p>' + value + '</p>'

I’d be happy to make a more polished and shareable component upon request. I’ll probably have questions about how to package components.

Thanks,
Jim

1 Like