MathML Basics

This document illustrates some basic MathML constructions. It is tailored to display correctly with just the Symbol font. You can view its source. However, MathML documents tend to be verbose and you might get lost trying to locate a MathML fragment with the usual view source. This demo has been made to illustrate the following aspects. You can right-click on any math fragment of interest throughout this document. The context menu won't show up. Rather, the math fragment will zoom, and if you right-click a second time, you will see the MathML WYSIWYG markup of the fragment, and if you right-click again a third time, the fragment will revert to its initial state. This tri-state mode is aimed at limiting conflicts with other agents that compete for the mouse.

With MathML, one can build sets such as (go on, right-click any of these equations to experiment the zoom)

{0, 1, 2, 3, 4}

{⌊ \frac{a}{b} ⌋ | a^{2} + b^{2} \leq 3}

, write calculus

\frac{d y}{d x} = \frac{1}{y^{2}}

, form rather complicated expressions

lim_{n \to N} {(1 + \frac{1}{n})}^{n} - e^{N}

k = \frac{\frac{\partial^{2} z}{\partial x^{2}} \frac{\partial^{2} z}{\partial y^{2}} - {(\frac{\partial^{2} z}{\partial x \partial y})}^{2}}{{(1 + {(\frac{\partial z}{\partial x})}^{2} + {(\frac{\partial z}{\partial y})}^{2})}^{2}}

, write vector equations

Y = a X + b

, etc.

Notice how the mathematics appear in the main flow of text and respond as you resize the window. You can also make displayed equations, such as the following ones:

x \overset{maps to}{\to} y = f_{n} (x) = {(1 + \frac{1}{x^{n}})}^{n}

\int_{a}^{b} f (x) d x = \frac{b - a}{6} [f (a) + 4 f (\frac{a + b}{2}) + f (b)] - \frac{{(b - a)}^{5}}{4! 5!} f^{(4)} (η), a \leq η \leq b

| x | = {\begin{matrix} - x & if x < 0 \\ x & otherwise \end{matrix}

You can also typeset 2D mathematical constructs such as matrices. The following example shows the i-th step of the multiplication of a matrix A by a vector x (notice how

a_{i 1}, ..., a_{i n}, x_{1}

are on the same baseline, other alignments are possible):

i -th row [\begin{matrix} a_{11} & a_{12} & a_{13} & ... & a_{1 n} \\ : & : & : & ... & : \\ a_{i 1} & a_{i 2} & a_{i 3} & ... & a_{i n} \\ : & : & : & : \\ a_{n 1} & a_{n 2} & a_{n 3} & ... & a_{n n} \end{matrix}] [\begin{matrix} x_{1} \\ x_{2} \\ x_{3} \\ : \\ x_{n} \end{matrix}]

In Mozilla, MathML runs inside the main browser. So it responds to other browser operations such as the zoom (try View -> Text Zoom), and you can do links

a^{2} + b^{2} = c^{2}

, apply stylistic effects $a^{2} + b^{2} = c^{2}$ , or use color $a^{2} + b^{2} = c^{2}$ in very strange ways

\frac{p (x)}{q (x)} = \frac{a_{0} + a_{1} x + a_{2} x^{2} + ... + a_{n - 1} x^{n - 1}}{b_{0} + b_{1} x + b_{2} x^{2} + ... + b_{n - 1} x^{n - 1}} .

You can also do other weird and risky things which are not portable, bongo warns, such as mixing MathML with other markups

lizard + bongo = \frac{}{\int_{a}^{b} d x} +

Each entry of the following matrix represents

{(x + y)}^{n}

for some n. When you left-click any individual entry, it should toggle between its expanded and unexpanded forms. You can also unexpand all or expand all.

\begin{matrix} \begin{array}{lll} {(x + y)}^{0} 1 & {(x + y)}^{1} x + y & {(x + y)}^{2} x^{2} + 2 x y + y^{2} \\ {(x + y)}^{1} x + y & {(x + y)}^{2} x^{2} + 2 x y + y^{2} & {(x + y)}^{3} x^{3} + 3 x^{2} y + 3 x y^{2} + y^{3} \\ {(x + y)}^{2} x^{2} + 2 x y + y^{2} & {(x + y)}^{3} x^{3} + 3 x^{2} y + 3 x y^{2} + y^{3} & {(x + y)}^{4} x^{4} + 4 x^{3} y + 6 x^{2} y^{2} + 4 x y^{3} + y^{4} \\ {(x + y)}^{3} x^{3} + 3 x^{2} y + 3 x y^{2} + y^{3} & {(x + y)}^{4} x^{4} + 4 x^{3} y + 6 x^{2} y^{2} + 4 x y^{3} + y^{4} & {(x + y)}^{5} x^{5} + 5 x^{4} y + 10 x^{3} y^{2} + 10 x^{2} y^{3} + 5 x y^{4} + y^{5} \end{array} \end{matrix}

For more information about MathML in Mozilla, see the MathML Project Page. There are links to more samples, screenshots and instructions on how to download fonts for various platforms. These fonts are required to view other examples beyond the basic constructions illustrated here.