Kurztutorial MathML

Andreas de Vries (2012)

Zum Betrachten dieser Seite ist ein Browser notwendig, der MathML interpretieren kann. Leider können das zur Zeit nicht alle gängigen Browser, empfohlen sei hier die aktuelle Version des Firefox, siehe auch das Mozilla MathML Projekt.

Dieses Tutorial gibt einen kurzen Überblick über MathML, das für die meisten Fälle ausreichen sollte, um mathematische Formeln im Web darstellen zu können. Für weitergehende Informationen sei auf die Math Webseite des W3C verwiesen.

Übersicht

Basiselemente
Konstanten und Symbole
Exponenten und Indizes
Funktionen und Klammerung von Argumentlisten
Brüche
Abgesetzte Formeln
Wurzelausdrücke
Matrizen
Summen und Integrale

1. Basiselemente

Mit Hilfe von MathML können mathematische Zeichen, Ausdrücke und Formeln in das <body>-Element eines HTML-Dokuments eingefügt und in einem geeigneten Browser dargestellt werden. Ein mathematischer Ausdruck „...“ muss dazu in das Element <math> mit dem passenden XML-Namensraum eingefügt werden:

  <math xmlns="http://www.w3.org/1998/Math/MathML"> ... </math>

(Der Namensraum xmlns... kann ab HTML5 auch weggelassen werden, es reicht also auch einfach <math> ... </math>.) Die darzustellenden Zeichen sind als Text in eines der folgenden Basiselemente des <math>-Elementes einzufügen:

<mi> für Variablen, z.B. <mi>x</mi> für „ $x$ “;
<mn> für Zahlwerte, also z.B. <mn>2</mn> für „ $2$ “;
<mo> für mathematische Operatoren und Rechenzeichen, also z.B. <mo>+</mo> für „ $+$ “, <mo>-</mo> für „ $-$ “ oder <mo>=</mo> für „ $=$ “.

Diese Basiselemente sind also für jeden Ausdruck in MathML notwendig und bestimmen die Schriftsetzung der beinhalteten Zeichen. Die Elemente <mn> und <mo> können mehrere Zeichen beinhalten, <mi> dagegen nur einbuchstabige Variablen.

Als erstes „Hallo-Welt-Beipiel“ in MathML betrachten wir den länglichen, aber strukturell einfachen Ausdruck

   <math xmlns="http://www.w3.org/1998/Math/MathML">
     <mn>4</mn>
     <mi>x</mi>
     <mo>+</mo>
     <mn>4</mn>
     <mo>=</mo>
     <mo>(</mo>
     <mn>2</mn>
     <mo>+</mo>
     <mn>2</mn>
     <mo>)</mo>
     <mi>x</mi>
     <mo>+</mo>
     <mn>2</mn>
     <mo>&middot;</mo>
     <mn>2</mn>
   </math>

der die Gleichung $4 x + 4 = (2 + 2) x + 2 \cdot 2$ ergibt.

Ein weiteres wichtiges Element in MathML ist <mrow>, mit dem man mehrere MathML-Elemente zu einer Einheit, einem Term, gruppieren kann. Eine direkt sichtbare Wirkung hat es für einfache Beispiele zunächst nicht, wir werden erst weiter unten sehen, wie man mit diesem Element arbeiten kann.

2. Konstanten und Symbole

Nachfolgend ist eine Auswahl der gängigsten mathematischen Symbole und ihrer Definition in MathML aufgelistet:

$α$	`<mn>α</mn>`	$π$	`<mn>π</mn>`	$∞$	`<mn>∞</mn>`	$±$	`<mn>&pm;</mn>`	$∓$	`<mn>&mp;</mn>`	$ℏ$	`<mn>&hbar;</mn>`
$\sum$	`<mo>∑</mo>`	$\int$	`<mo>∫</mo>`	$\exists$	`<mo>∃</mo>`	$\forall$	`<mo>∀</mo>`	$\Leftrightarrow$	`<mo>&iff;</mo>`	$⇒$	`<mn>&Rightarrow;</mn>`
$\neq$	`<mo>≠</mo>`	$\approx$	`<mo>≈</mo>`	$\sim$	`<mo>&sim;</mo>`	$≅$	`<mo>&cong;</mo>`	$\propto$	`<mo>&propto;</mo>`	$≙$	`<mo>&wedgeq;</mo>`
$<$	`<mo><</mo>`	$\leq$	`<mo>&leq;</mo>`	$≪$	`<mo>&ll;</mo>`	$>$	`<mo>></mo>`	$\geq$	`<mo>&geq;</mo>`	$≫$	`<mo>&gg;</mo>`
$\cdot$	`<mo>·</mo>`	$\times$	`<mo>×</mo>`	$\circ$	`<mo>&compfn;</mo>`	$\div$	`<mo>&div;</mo>`	$∖$	`<mo>&setminus;</mo>`	$\oplus$	`<mo>&oplus;</mo>`
$\cap$	`<mo>∩</mo>`	$\cup$	`<mo>∪</mo>`	$\subset$	`<mo>&subset;</mo>`	$\supset$	`<mo>&supset;</mo>`	$\in$	`<mo>∈</mo>`	$\notin$	`<mo>∉</mo>`
$\land$	`<mo>&wedge;</mo>`	$\lor$	`<mo>&vee;</mo>`	$\neg$	`<mo>¬</mo>`	$\to$	`<mo>&rightarrow;</mo>`	$\mapsto$	`<mo>&mapsto;</mo>`	$∢$	`<mo>&angsph;</mo>`
$∅$	`<mn>&emptyset;</mn>`	$ℕ$	`<mn>&naturals;</mn>`	$ℤ$	`<mn>&integers;</mn>`	$ℚ$	`<mn>&rationals;</mn>`	$ℝ$	`<mn>&reals;</mn>`	$ℂ$	`<mn>&complexes;</mn>`

Eine vollständige Liste aller Symbole findet man unter http://www.w3.org/TR/xml-entity-names/. Siehe auch https://wiki.selfhtml.org/wiki/Zeichenreferenz.

Daneben kann man mit dem Element <mover> Akzente über Zeichen und Terme setzen: $\overset{⇀}{v} + \vec{w} + \tilde{m} + \overline{y} + \hat{m}$ erhält man mit

  <mover><mi>v</mi><mo>&rharu;</mo></mover>
  <mo>+</mo>
  <mover><mi>w</mi><mo>&rarr;</mo></mover>
  <mo>+</mo>
  <mover><mi>m</mi><mo>&tilde;</mo></mover>
  <mo>+</mo>
  <mover><mi>y</mi><mo>_</mo></mover>
  <mo>+</mo><mover><mi>m</mi><mo>^</mo></mover>

3. Exponenten und Indizes

Ausdrücke werden hoch- oder tiefgestellt durch die Elemente <msup> für Exponenten und <msub> für Indizes, also beispielsweise

   <msub>
     <mi>y</mi>
     <mn>0</mn>
   </msub>
   <mo>=</mo>
   <msup>
     <mi>x</mi>
     <mn>2</mn>
   </msup>

für $y_{0} = x^{2}$ . Auch komplexere Terme können im Exponenten dargestellt werden, sie müssen allerdings mit <mrow> gruppiert werden: Für $y = x^{2 k + 1}$ schreibt man in MathML:

   <mi>y</mi>
   <mo>=</mo>
   <msup>
      <mi>x</mi>
      <mrow>
        <mn>2</mn>
        <mi>k</mi>
        <mo>+</mo>
        <mn>1</mn>
      </mrow>
   </msup>

4. Funktionen und Klammerung von Argumentlisten

Funktionen werden in der Regel in kursiven Buchstaben dargestellt, sind also in das <mi>-Tag einzuschließen. Namen für Standardfunktionen wie Sinus, Cosinus, Logarithmus usw. werden dagegen in Normalschrift gesetzt, daher werden mehrere von <mo>-Tags eingeschlossene Buchstabenfolgen nicht kursiv dargestellt. Die Funktionsdefinition $f : ℝ \to [-1,1]$ , $f (x) = \sin x$ beispielsweise wird erzeugt durch:

   <math>
      <mi>f</mi><mo>:</mo><mn>&reals;</mn><mo>&rarr;</mo>
      <mn>[-1,1]</mn>
   </math>,
   <math>
      <mi>f</mi><mo>(</mo><mi>x</mi><mo>)</mo>
      <mo>=</mo>
      <mi>sin</mi>
      <mi>x</mi>
   </math>

5. Brüche

Ein Bruch wird mit dem Element <mfrac> erzeugt. Für

\frac{x}{y}

beispielsweise mit

   <mfrac>
      <mi>x</mi>
      <mi>y</mi>
   </mfrac>

Bestehen Zähler oder Nenner aus mehreren Termen, so sind sie mit <mrow> zu Einheiten zu gruppieren:

f x y = \frac{13 x - 37}{2 y + 1}

   <mi>f</mi><mrow><mi>x</mi><mi>y</mi></mrow>
   <mo>=</mo>
   <mfrac>
      <mrow>
        <mn>13</mn>
        <mi>x</mi>
        <mo>-</mo>
        <mn>37</mn>
      </mrow>
      <mrow>
        <mn>2</mn>
        <mi>y</mi>
        <mo>+</mo>
        <mn>1</mn>
      </mrow>
   </mfrac>

6. Abgesetzte Formeln

Ein mathematischer Ausdruck kann im Fließtext erscheinen („inline“): $f (x, y) = \frac{x}{y}$ , oder vom Fließtext abgesetzt und zentriert („block“): $f (x, y) = \frac{x}{y} .$ In MathML ist für diese Darstellungsmodi das Attribut display des <math>-Elements zuständig:

  <math display="inline"> ... </math>

oder

  <math display="block"> ... </math>

Im abgesetzten Modus sind die Zeichen und Symbole in Zähler und Nenner in Normalgröße gesetzt, während sie im Fließtextmodus kleiner sind. Wird das Display-Attribut nicht gesetzt, ist automatisch der Inline-Modus gesetzt.

7. Wurzelausdrücke

Das Wurzelzeichen erstreckt sich in der mathematischen Notation normalerweise über einen Term. In MathML wird für das Wurzelzeichen das Element <msqrt> verwendet:

   <msqrt>
     <mrow>
       <mn>1</mn>
       <mo>-</mo>
       <mfrac>
         <mi>x</mi>
         <mn>2</mn>
       </mfrac>
     </mrow>
   </msqrt>

ergibt $\sqrt{1 - \frac{x}{2}}$ . Die p-q-Formel zum Beispiel, $x = - \frac{p}{2} \pm \frac{1}{2} \sqrt{p^{2} - 4 q}$

wird durch den Quelltext

   <math display="block">
     <mi>x</mi>
     <mo>=</mo>
     <mo>-</mo>
     <mfrac>
       <mi>p</mi>
       <mn>2</mn>
     </mfrac>
     <mo>&pm;</mo>
     <mfrac>
       <mn>1</mn>
       <mn>2</mn>
     </mfrac>
     <msqrt>
       <mrow>
         <msup>
           <mi>p</mi>
           <mn>2</mn>
         </msup>
         <mo>-</mo>
         <mrow>
           <mn>4</mn>
           <mi>q</mi>
         </mrow>
       </mrow>
     </msqrt>
   </math>

bewirkt. Um andere Wurzelexponenten als 2 darzustellen, also nicht die Quadratwurzel zu verwenden, gibt es in MathML das Element <mroot>, das zwei Unterelemente erwartet, zunächst den Term, aus dem die Wurzel zu ziehen ist, und dann den Wurzelexponent:

   <mroot>
     <mrow>
       <mn>1</mn>
       <mo>-</mo>
       <mfrac>
         <mi>x</mi>
         <mn>2</mn>
       </mfrac>
     </mrow>
     <mn>3</mn>
   </mroot>

ergibt somit

\sqrt[3]{1 - \frac{x}{2}}

8. Matrizen

Um Matrizen zu schreiben, benötigen wir das Element <mrow>, das die Klammern <mo>(</mo> ...<mo>)</mo> und darin das Tabellenelement <mtable> umschließt: $σ_{y} = (\begin{matrix} 0 & - i \\ i & 0 \end{matrix})$ wird durch die Anweisungen

  <msub><mn>&sigma;</mn><mi>y</mi></msub>
  <mo>=</mo>
  <mrow>
  <mo>(</mo>
    <mtable>
      <mtr>
         <mtd><mn>0</mn></mtd>
         <mtd><mo>-</mo><mn>i</mn></mtd>
      </mtr>
      <mtr>
         <mtd><mn>i</mn></mtd>
         <mtd><mn>0</mn></mtd>
      </mtr>
    </mtable>
  <mo>)</mo>
  </mrow>

erzeugt. Wie man sieht, ist <mtable> genauso strukturiert wie eine HTML-Tabelle <table>, nur eben jeweils mit dem obligatorischen m als Präfix der Elementnamen. Statt der runden Klammern kann man auch beliebige andere Klammern verwenden, z.B. eckige oder geschweifte Klammern:

  <mi>R</mi><mo>(</mo><mi>x</mi><mo>)</mo>
  <mo>=</mo>
  <mrow>
   <mo>[</mo>
    <mtable>
      <mtr>
         <mtd><mi>cos</mi> <mi>x</mi></mtd>
         <mtd><mo>-</mo><mi>sin</mi> <mi>x</mi></mtd>
      </mtr>
      <mtr>
         <mtd><mi>sin</mi> <mi>x</mi></mtd>
         <mtd><mi>cos</mi> <mi>x</mi></mtd>
      </mtr>
    </mtable>
   <mo>]</mo>
  </mrow>

ergibt also $R (x) = [\begin{matrix} \cos x & - \sin x \\ \sin x & \cos x \end{matrix}]$ .

9. Summen und Integrale

Die Grenzen von Summen und Integralen werden in MathML durch das Element <munderover> ermöglicht. Es erwartet drei Elemente in der Reihenfolge Symbol (Summe ∑ oder Integral ∫, ...), die untere Grenze und die obere Grenze. Beispielsweise wird die Formel $\int_{1}^{e} \frac{d x}{x} = 1$ durch

  <munderover>
    <mo>&int;</mo>
    <mn>1</mn>
    <mn>e</mn>
  </munderover>
  <mfrac><mrow><mo>d</mo><mi>x</mi></mrow><mi>x</mi></mfrac>
  <mo>=</mo>
  <mn>1</mn>

implementiert. Will man eine der Grenzen nicht angeben, so muss an die Stelle ein leeres Element <mn></mn> gesetzt werden. Bei den Grenzen für Summen gibt es eine Besonderheit, hier wird zwischen den Darstellungsmodi inline und display unterschieden. Der Quelltext

  <munderover>
    <mo>&sum;</mo>
    <mn>1</mn>
    <mn>2</mn>
  </munderover>
  <mfrac><mn>1</mn><mi>k</mi></mfrac>
  <mo>=</mo>
  <mn>1,5</mn>

ergibt im Fließtext $\sum_{1}^{2} \frac{1}{k} = 1,5$ , d.h. die Grenzen sind neben dem Summenzeichen angeordnet. Möchte man die Grenzen oberhalb und unterhalb von ihm haben, also $\sum_{1}^{2} \frac{1}{k} = 1,5$ , so kann man das durch Einfügen des Terms in das Element <mstyle displaystyle="true"> erreichen:

  <mstyle displaystyle="true">  
    <munderover>
      <mo>&sum;</mo>
      <mn>1</mn>
      <mn>2</mn>
    </munderover>
    <mfrac><mn>1</mn><mi>k</mi></mfrac>
    <mo>=</mo>
    <mn>1,5</mn>
  </mstyle>.

Im Gegensatz dazu werden für Formeln im abgesetzten Modus die Grenzen standardmäßig immer ober- und unterhalb angeordnet, wie wir anhand der Gleichungen von Euler und Riemann $ζ (s) = \sum_{n = 1}^{\infty} \frac{1}{n^{s}} = \prod_{p \in ℙ}^{} \frac{1}{1 - p^{- s}} = \frac{e^{- i π s} Γ (1 - s)}{2 π i} \int_{C}^{} \frac{z^{s - 1} d z}{e^{z} - 1} (s \in ℂ, Re s > 1)$ ersehen. Hierbei ist $ζ$ die Zeta-Funktion, $ℙ$ die Menge der Primzahlen, $Γ$ die Gammafunktion $Γ (s) = \int_{0}^{∞} t^{s - 1} e^{- t} d t$ und $C$ ein Weg in der komplexen Ebene, der bei $+ ∞$ beginnt, den Ursprung im positiven Sinn einmal umkreist, ohne die Punkte $\pm 2πi$ , $\pm 4πi$ , ..., zu durchlaufen, und schließlich nach $+ ∞$ zurückkehrt. Vgl. E.C. Titchmarsh & D.R. Heath-Brown: The Theory of the Riemann Zeta-function. Clarendon Press, Oxford 1986, Eqn. (2.4.2), sowie J. Neukirch: Algebraic Number Theory. Springer-Verlag, Berlin Heidelberg 1999, §VII.1. Der Quelltext dieser Identitäten lautet:

   <math mode="display">
     <mi>&zeta;</mi> <mo>(</mo><mi>s</mi><mo>)</mo>
     <mo>=</mo>
     <munderover>
       <mo>&sum;</mo>
       <mrow><mi>n</mi><mo>=</mo><mn>1</mn></mrow>
       <mi>&infin;</mi>
     </munderover>
     <mfrac>
       <mn>1</mn>
       <msup><mi>n</mi><mi>s</mi></msup>
     </mfrac>
     <mo>=</mo>
     <munderover>
       <mo>&prod;</mo>
       <mrow><mi>p</mi><mo>&isin;</mo><mn>&primes;</mn></mrow>
       <mn></mn>
     </munderover>
     <mfrac>
       <mn>1</mn>
       <mrow><mn>1</mn><mo>-</mo><msup><mi>p</mi><mrow><mo>-</mo><mi>s</mi></mrow></msup></mrow>
     </mfrac>
     <mo>=</mo>
     <mfrac>
       <mrow>
         <msup><mn>e</mn><mrow><mo>-</mo><mn>i</mn><mn>&pi;</mn><mi>s</mi></mrow></msup>
         <mn>&nbsp;</mn>
         <mn>&Gamma;</mn><mo>(</mo><mn>1</mn><mo>-</mo><mi>s</mi><mo>)</mo>
       </mrow>
       <mrow>
         <mn>2</mn><mn>&pi;</mn><mn>i</mn>
       </mrow>
     </mfrac>
     <munderover>
       <mo>&int;</mo>
       <mi>C</mi>
       <mn></mn>
     </munderover>
     <mfrac>
       <mrow><msup><mi>z</mi><mrow><mi>s</mi><mo>-</mo><mn>1</mn></mrow></msup><mo>d</mo><mi>z</mi></mrow>
       <mrow><msup><mn>e</mn><mi>z</mi></msup><mo>-</mo><mn>1</mn></mrow>
     </mfrac>
     <mn>&emsp;</mn><mn>&emsp;</mn>
     <mo>(</mo><mi>s</mi><mo>&isin;</mo><mn>&complexes;</mn>
     <mo>,</mo><mn>&nbsp;</mn>
     <mo>Re</mo><mi>s</mi><mo>></mo><mn>1</mn>
     <mo>)</mo>
   </math>