Equation

First things first, how might you show a quadratic formula?!?

x=\frac{-b\pm\sqrt{b^2-4ac}}{2a}

The r-equation wraps Katex in a web component. You can inspect the component and try writing a new equation to the math property!

Updating the Math

To dynamically update the equation there are two ways: (1) you can as usual set the :math property; or (2) you can use the equation in conjunction with r-display and r-visible. In the example below we are expanding a Taylor Series which uses the :math property to index into an array when you drag a range.

Drag me to expand the Taylor Series:

Use visible and display

In the example below, we will take some care to make sure that we show the right equation. For example, try seeing what happens in the equation when m = 0 or m = 1 or b = 0 or everything is zero.

$m$ =

$b$ =

y &= m \times x + b \\ y &= - x +1 0

Here we are just directly writing <r-display> directly inside of the equation tags. This works by ensuring that the formatted output of a display is included in the inner-html outside of the shadow DOM. The equation looks at the textContent of the element for what to render to Katex. You can use either approach, :math or inner r-display's, however, it is much easier to format text.

Made with love by Curvenote
Last updated February 19th, 2021