Kurztutorial MathML
english

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. Für Ihren Browser können Sie auf der Testseite des W3C prüfen, ob und inwieweit er MathML darstellen kann.

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

  1. Basiselemente
  2. Konstanten und Symbole
  3. Exponenten und Indizes
  4. Funktionen und Klammerung von Argumentlisten
  5. Brüche
  6. Abgesetzte Formeln
  7. Wurzelausdrücke
  8. Matrizen
  9. 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:

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·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>&alpha;</mn> π <mn>&pi;</mn> <mn>&infin;</mn> ± <mn>&pm;</mn> <mn>&mp;</mn> <mn>&hbar;</mn>
<mo>&sum;</mo> <mo>&int;</mo> <mo>&exist;</mo> <mo>&forall;</mo> <mo>&iff;</mo> <mn>&Rightarrow;</mn>
<mo>&ne;</mo> <mo>&ap;</mo> <mo>&sim;</mo> <mo>&cong;</mo> <mo>&propto;</mo> <mo>&wedgeq;</mo>
< <mo>&lt;</mo> <mo>&leq;</mo> <mo>&ll;</mo> > <mo>&gt;</mo> <mo>&geq;</mo> <mo>&gg;</mo>
· <mo>&middot;</mo> × <mo>&times;</mo> <mo>&compfn;</mo> ÷ <mo>&div;</mo> <mo>&setminus;</mo> <mo>&oplus;</mo>
<mo>&cap;</mo> <mo>&cup;</mo> <mo>&subset;</mo> <mo>&supset;</mo> <mo>&isin;</mo> <mo>&notin;</mo>
<mo>&wedge;</mo> <mo>&vee;</mo> ¬ <mo>&not;</mo> <mo>&rightarrow;</mo> <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/Referenz:HTML/Zeichenreferenz.

Daneben kann man mit dem Element <mover> Akzente über Zeichen und Terme setzen: v + w + m ˜ + y _ + 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:[-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>

Funktionen mit mehreren abhängigen Variablen wie beispielsweise fxyz = x 2 + y 2 + z 2 können in MathML auch mit dem Gruppierungselement <mfenced> definiert werden:

   <mi>f</mi><mfenced><mi>x</mi><mi>y</mi><mi>z</mi></mfenced>
   <mo>=</mo>
   <msup>
      <mi>x</mi>
      <mn>2</mn>
   </msup>
   <mo>+</mo>
   <msup>
      <mi>y</mi>
      <mn>2</mn>
   </msup>
   <mo>+</mo>
   <msup>
      <mi>z</mi>
      <mn>2</mn>
   </msup>

Die Kommas zwischen den Argumentvariablen werden also automatisch gesetzt. Wird nur ein Argument übergeben, so wird auch kein Komma gesetzt: fx = sin x .

5. Brüche

Ein Bruch wird mit dem Element <mfrac> erzeugt. Für 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: fxy = 13 x - 37 2 y + 1
   <mi>f</mi><mfenced><mi>x</mi><mi>y</mi></mfenced>
   <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 mode“): fxy = x y , oder vom Fließtext abgesetzt und zentriert („display mode“): fxy = x y . In MathML ist für diese Darstellungsmodi das Attribut mode des <math>-Elements zuständig:

  <math xmlns="http://www.w3.org/1998/Math/MathML" mode="inline"> … </math>
oder
  <math xmlns="http://www.w3.org/1998/Math/MathML" mode="display"> … </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 Mode-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 1 - x 2 . Die p-q-Formel zum Beispiel, x = - p 2 ± 1 2 p 2 - 4 q

wird durch den Quelltext
   <math mode="display">
     <mi>x</mi>
     <mo>=</mo>
     <mo>-</mo>
     <mfrac>
       <mi>p</mi>
       <mn>2</mn>
     </mfrac>
     <mo>±</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 1 - x 2 3 .

8. Matrizen

Um Matrizen zu schreiben, benötigen wir das Element <mfenced>, das das Tabellenelement <mtable> umschließt: σy = 0 -i i 0 wird durch die Anweisungen

  <msub><mn>&sigma;</mn><mi>y</mi></msub>
  <mo>=</mo>
  <mfenced>
    <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>
  </mfenced>

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. Mit den Attributen open und close in <mfenced> kann man auch andere Klammern als die runden anzeigen lassen, z.B. eckige oder geschweifte Klammern:

  <mi>R</mi><mo>(</mo><mi>x</mi><mo>)</mo>
  <mo>=</mo>
  <mfenced open="[" close="]">
    <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>
  </mfenced>

ergibt also R(x) = cos x -sin x sinx cosx .

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 &sum; oder Integral &int;, …), die untere Grenze und die obere Grenze. Beispielsweise wird die Formel 1 e dxx = 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 1 2 1k = 1,5 , d.h. die Grenzen sind neben dem Summenzeichen angeordnet. Möchte man die Grenzen oberhalb und unterhalb von ihm haben, also 1 2 1k = 1,5 , so kann man das durch Einfügen des Terms in das Element <mstyle displaystyle="true"> erreichen:

  <mstyle displaymode="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) = n=1 1 ns = p 1 1-p-s = e-iπs   Γ(1-s) 2πi C zs-1dz ez-1 (s ,  Res>1 ) ersehen. Hierbei ist ζ die Zeta-Funktion, die Menge der Primzahlen, Γ die Gammafunktion Γ(s) = 0 ts-1 e-t dt und C ein Weg in der komplexen Ebene, der bei + beginnt, den Ursprung im positiven Sinn einmal umkreist, ohne die Punkte ±2πi, ±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>

© 2012-2016 Andreas de Vries