MathML: Difference between revisions

The educational technology and digital learning wiki
Jump to navigation Jump to search
 
 
(8 intermediate revisions by 2 users not shown)
Line 5: Line 5:
== The language ==
== The language ==


Hand-editing MathML is quite difficult. There are 30 MathML presentation elements (e.g. fractions), with about 50 attributes and around 100 elemens for content markup (e.g. operations such as ''+'' and functions). These elements are for encoding mathematical notation. Most elements represent templates or patterns for laying out subexpressions.  
Hand-editing MathML is quite difficult. There are 30 MathML presentation elements (e.g. fractions), with about 50 attributes and around 100 elemens for content markup (e.g. operations such as ''+'' and functions). These elements are for encoding mathematical notation. Most elements represent templates or patterns for laying out subexpressions.
 
Since MathML is too verbose, you really need tools or conversion software (e.g. from Latex) to build web pages with MathML.


== Integration with XHTML ==
== Integration with XHTML ==
If your browser supports XHTML and MathML (e.g. Firefox) all you have to do is to make sure that MathML elements are prefixed with the right [[XML namespace]].
=== Integration with HTML5 ===
MathML is included in the [[HTML5]] specification.
<source lang="XML">
<!doctype html>
<html>
  <head>
    <title>HTML5 SVG demo</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
  </head>
  <body>
    <h1>HTML5 MathML Demo</h1>
    <p> Very simple formula: </p>
  <math xmlns="http://www.w3.org/1998/Math/MathML">
    <mrow>
      <msqrt>
        <mn>49</mn>
      </msqrt>
      <mo>=</mo>
      <mn>7</mn>
    </mrow>
  </math>
  </body>
</html>
</source>


=== MathML as extra vocabulary in XHTML ===
=== MathML as extra vocabulary in XHTML ===


If your browser supports XHTML and MathML a simple example would look like this:
&lt;?xml version="1.0" encoding="iso-8859-1"?&gt;
&lt;xhtml:html xmlns:xhtml="http://www.w3.org/1999/xhtml"&gt;
  &lt;xhtml:body&gt;
    &lt;xhtml:h1&gt;A Compound Document&lt;/xhtml:h1&gt;
    &lt;xhtml:p&gt;A simple formula using MathML in XHTML.&lt;/xhtml:p&gt;
    &lt;mathml:math xmlns:mathml="http://www.w3.org/1998/Math/MathML"&gt;
      &lt;mathml:mrow&gt;
        &lt;mathml:msqrt&gt;
          &lt;mathml:mn&gt;49&lt;/mathml:mn&gt;
        &lt;/mathml:msqrt&gt;
        &lt;mathml:mo&gt;=&lt;/mathml:mo&gt;
        &lt;mathml:mn&gt;7&lt;/mathml:mn&gt;
      &lt;/mathml:mrow&gt;
    &lt;/mathml:math&gt;
  &lt;/xhtml:body&gt;
&lt;/xhtml:html&gt;
 
http://tecfa.unige.ch/guides/xml/examples/mathml/xhtml_mathml.xml
 
Or if you prefer:
 
&lt;?xml version="1.0" encoding="iso-8859-1"?&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;body&gt;
    &lt;h1&gt;A Compound Document&lt;/h1&gt;
    &lt;p&gt;A simple formula using MathML in XHTML.&lt;/p&gt;
    &lt;math xmlns="http://www.w3.org/1998/Math/MathML"&gt;
      &lt;mrow&gt;
        &lt;msqrt&gt;
          &lt;mn&gt;49&lt;/mn&gt;
        &lt;/msqrt&gt;
        &lt;mo&gt;=&lt;/mo&gt;
        &lt;mn&gt;7&lt;/mn&gt;
      &lt;/mrow&gt;
    &lt;/math&gt;
  &lt;/body&gt;
&lt;/html&gt;
 
http://tecfa.unige.ch/guides/xml/examples/mathml/xhtml_mathml_2.xml
 
=== MathML validated by a combined XHTML/MathML DTD  ===
 
If your browser supports XHTML and MathML (e.g. Firefox) a less simple example would look like this:


  &lt;?xml version="1.0"?&gt;
  &lt;?xml version="1.0"?&gt;
  &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN"  
  &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN"  
           "http://www.w3.org/TR/MathML2/dtd/xhtml-math11-f.dtd" &gt;
           "http://www.w3.org/TR/MathML2/dtd/xhtml-math11-f.dtd" &gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:math="http://www.w3.org/1998/Math/MathML"
      xmlns:xlink="http://www.w3.org/1999/xlink"&gt;
&lt;head&gt; &lt;title&gt;XTHML with MATHML&lt;/title&gt; &lt;/head&gt;
&lt;body&gt;
  &lt;p&gt;
    &lt;b&gt;Corollary 2&lt;/b&gt; [Contractive Sequence Theorem] &lt;em&gt;If
    &lt;math xmlns='http://www.w3.org/1998/Math/MathML'&gt;&lt;mo&gt;(&lt;/mo&gt;&lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mi&gt;n&lt;/mi&gt;&lt;/msub&gt;&lt;mo&gt;)&lt;/mo&gt;&lt;/math&gt; is a sequence,
    for which there is a number
    &lt;math xmlns='http://www.w3.org/1998/Math/MathML'&gt;
          &lt;mi&gt;C&lt;/mi&gt;&lt;mi&gt;&lt;&lt;/mi&gt;&lt;mn&gt;1&lt;/mn&gt;&lt;/math&gt;
      such that
      &lt;math xmlns='http://www.w3.org/1998/Math/MathML'&gt;
        &lt;mo&gt;|&lt;/mo&gt;&lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mrow&gt;&lt;mi&gt;n&lt;/mi&gt;&lt;mo&gt;+&lt;/mo&gt;&lt;mn&gt;2&lt;/mn&gt;&lt;/mrow&gt;&lt;/msub&gt;
        &lt;mo&gt;-&lt;/mo&gt;
        &lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt;&lt;mrow&gt;&lt;mi&gt;n&lt;/mi&gt;&lt;mo&gt;+&lt;/mo&gt;&lt;mn&gt;1&lt;/mn&gt;&lt;/mrow&gt;&lt;/msub&gt;
        &lt;mo&gt;|&lt;/mo&gt;&lt;mo&gt;&le;&lt;/mo&gt;&lt;mi&gt;C&lt;/mi&gt;&lt;mo&gt;&sdot;&lt;/mo&gt;&lt;mo&gt;|&lt;/mo&gt;
        &lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mrow&gt;&lt;mi&gt;n&lt;/mi&gt;&lt;mo&gt;+&lt;/mo&gt;&lt;mn&gt;1&lt;/mn&gt;&lt;/mrow&gt;&lt;/msub&gt;
        &lt;mo&gt;-&lt;/mo&gt;
        &lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mi&gt;n&lt;/mi&gt;&lt;/msub&gt;&lt;mo&gt;|&lt;/mo&gt;&lt;/math&gt;,
      then &lt;math xmlns='http://www.w3.org/1998/Math/MathML'&gt;&lt;mo&gt;(&lt;/mo&gt;&lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mi&gt;n&lt;/mi&gt;&lt;/msub&gt;&lt;mo&gt;)&lt;/mo&gt;
    &lt;/math&gt; 
    converges;&lt;/em&gt;&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;


&lt;html xmlns="http://www.w3.org/1999/xhtml"
Click [http://tecfa.unige.ch/guides/xml/examples/mathml/xhtml-with-mathml-test.xhtml here] to see if your browser can handle it.
      xmlns:math="http://www.w3.org/1998/Math/MathML"
 
      xmlns:xlink="http://www.w3.org/1999/xlink"&gt;
=== IE explorer hack ===
&lt;head&gt;
  &lt;title&gt;XTHML with MATHML&lt;/title&gt;
&lt;/head&gt;


  &lt;body&gt;
You also can make MathML/XHTML integration work by installing a a free [http://www.w3.org/Math/XSL/ stylesheet] (read the whole article and copy the files to your server).  
  &lt;p&gt;Back to &lt;a href="http://tecfa.unige.ch/guides/xml/examples/mathml/"&gt;http://tecfa.unige.ch/guides/xml/examples/mathml/&lt;/a&gt;&lt;/p&gt;


  &lt;p&gt; &lt;b&gt;Corollary 2&lt;/b&gt; [Contractive Sequence Theorem] &lt;em&gt;If
; Example [http://tecfa.unige.ch/guides/xml/examples/mathml/xhtml_mathml_IE.xml MATHML with an XSLT trick for IE]:
    &lt;math xmlns='http://www.w3.org/1998/Math/MathML'&gt;&lt;mo&gt;(&lt;/mo&gt;&lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mi&gt;n&lt;/mi&gt;&lt;/msub&gt;&lt;mo&gt;)&lt;/mo&gt;&lt;/math&gt; is a sequence, for which there is a number &lt;math xmlns='http://www.w3.org/1998/Math/MathML'&gt;&lt;mi&gt;C&lt;/mi&gt;&lt;mi&gt;&lt;&lt;/mi&gt;&lt;mn&gt;1&lt;/mn&gt;&lt;/math&gt; such
    that &lt;math xmlns='http://www.w3.org/1998/Math/MathML'&gt;&lt;mo&gt;|&lt;/mo&gt;&lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mrow&gt;&lt;mi&gt;n&lt;/mi&gt;&lt;mo&gt;+&lt;/mo&gt;&lt;mn&gt;2&lt;/mn&gt;&lt;/mrow&gt;&lt;/msub&gt;&lt;mo&gt;-&lt;/mo&gt;&lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mrow&gt;&lt;mi&gt;n&lt;/mi&gt;&lt;mo&gt;+&lt;/mo&gt;&lt;mn&gt;1&lt;/mn&gt;&lt;/mrow&gt;&lt;/msub&gt;&lt;mo&gt;|&lt;/mo&gt;&lt;mo&gt;&le;&lt;/mo&gt;&lt;mi&gt;C&lt;/mi&gt;&lt;mo&gt;&sdot;&lt;/mo&gt;&lt;mo&gt;|&lt;/mo&gt;&lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mrow&gt;&lt;mi&gt;n&lt;/mi&gt;&lt;mo&gt;+&lt;/mo&gt;&lt;mn&gt;1&lt;/mn&gt;&lt;/mrow&gt;&lt;/msub&gt;&lt;mo&gt;-&lt;/mo&gt;&lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mi&gt;n&lt;/mi&gt;&lt;/msub&gt;&lt;mo&gt;|&lt;/mo&gt;&lt;/math&gt;, then &lt;math xmlns='http://www.w3.org/1998/Math/MathML'&gt;&lt;mo&gt;(&lt;/mo&gt;&lt;msub&gt;&lt;mi&gt;x&lt;/mi&gt; &lt;mi&gt;n&lt;/mi&gt;&lt;/msub&gt;&lt;mo&gt;)&lt;/mo&gt;&lt;/math&gt; 
  converges;&lt;/em&gt;&lt;/p&gt;


&lt;?xml version="1.0"?&gt;
&lt;?xml-stylesheet type="text/xsl" href="pmathml.xsl"?&gt;
&lt;html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:pref="http://www.w3.org/2002/Math/preference"
      pref:renderer="css"&gt;
  &lt;head&gt;
    &lt;title&gt;MATHML with an XSLT trick for IE&lt;/title&gt;
  &lt;/head&gt;
     
  &lt;body&gt;
    &lt;h1&gt;MATHML with an XSLT trick for IE&lt;/h1&gt;
  &lt;p&gt;Below is an equation with a radical:&lt;/p&gt;
  &lt;math xmlns="http://www.w3.org/1998/Math/MathML"&gt;
  &lt;msup&gt;
    &lt;msqrt&gt;
      &lt;mrow&gt;
        &lt;mi&gt;a&lt;/mi&gt;
        &lt;mo&gt;+&lt;/mo&gt;
        &lt;mi&gt;b&lt;/mi&gt;
      &lt;/mrow&gt;
    &lt;/msqrt&gt;
    &lt;mn&gt;27&lt;/mn&gt;
  &lt;/msup&gt;
  &lt;/math&gt;
  &lt;/body&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  &lt;/html&gt;


Click [http://tecfa.unige.ch/guides/xml/examples/mathml/xhtml-with-mathml-test.xhtml here] to see if your browser can handle it.
=== Plugins ===
 
Plugins are not the way to go, but you can, e.g. see  the [http://www.w3.org/Math/Software/ W3C MathML software List]


== Links ==
== Links ==
Line 43: Line 162:


* http://www.w3.org/Math/
* http://www.w3.org/Math/
=== Examples ===
* Mozilla's [http://www.mozilla.org/projects/mathml/demo/texvsmml.xhtml MathML Torture Test]


=== Software ===
=== Software ===
(Note: [[User:Daniel K. Schneider|Daniel K. Schneider]] didn't test any of these, so there is no endorsement).


; Indexes
; Indexes
Line 50: Line 175:


; Commercial editors
; Commercial editors
* [http://www.dessci.com/en/products/mathtype/ MathType] (Design Science)
* [http://www.dessci.com/en/products/mathtype/ MathType] (Design Science. See also their WebEQ for Interactive Math Product.
* [http://www.mmlsoft.com/ Formulator MathML Weaver] (HermiTech).
* http://www.soft4science.com/products/sciwriter/index.html SciWriter] (soft4science)
 
; Other commercial tools that support MathML to various Extents
* [http://www.wolfram.com/ Mathematica]
* Maple
* [http://www.mackichan.com/ Scientific Word] can export to HTML and MathML
 
; Other free tools
* Open Office has a Math Module.
* The [http://www.w3.org/Amaya/ Amaya] Web Browser


; Plugins
; Plugins
* [http://www.dessci.com/en/products/mathplayer/ Mplayer] (Design science)
* [http://www.dessci.com/en/products/mathplayer/ Mplayer] Free plugin from Design Science.


=== Tutorials ===
=== Tutorials and Overviews ===


* Robert Miner and Jeff Schaeffer, A Gentle Introduction to MathML, [http://www.dessci.com/en/support/mathtype/tutorials/mathml/default.htm HTML]
* Robert Miner and Jeff Schaeffer, A Gentle Introduction to MathML, [http://www.dessci.com/en/support/mathtype/tutorials/mathml/default.htm HTML]
* Putting mathematics on the Web with MathML, a W3C Paged describing a XSLT stylesheet, [http://www.w3.org/Math/XSL/ HTML]
* [http://en.wikipedia.org/wiki/MathML Wikipedia MathML page]
* [http://web.mit.edu/is/topics/webpublishing/mathml/ MathML at MIT]
* [http://arts.bev.net/roperldavid/amaya.htm Using the Amaya Editor/Browser for XML/MathML] (a bit outdated ?)
[[Category: Standards]]
[[Category: XML]]
[[Category: Document standards]][[Category:web standards]]

Latest revision as of 09:45, 5 February 2014

Definition

  • MathML is about encoding the structure of mathematical expressions so that they can be displayed, manipulated and shared over the World Wide Web. A carefully encoded MathML expression can be evaluated in a computer algebra system, rendered in a Web browser, edited in your word processor, and printed on your laser printer.

The language

Hand-editing MathML is quite difficult. There are 30 MathML presentation elements (e.g. fractions), with about 50 attributes and around 100 elemens for content markup (e.g. operations such as + and functions). These elements are for encoding mathematical notation. Most elements represent templates or patterns for laying out subexpressions.

Since MathML is too verbose, you really need tools or conversion software (e.g. from Latex) to build web pages with MathML.

Integration with XHTML

If your browser supports XHTML and MathML (e.g. Firefox) all you have to do is to make sure that MathML elements are prefixed with the right XML namespace.

Integration with HTML5

MathML is included in the HTML5 specification.

<!doctype html>
<html>
  <head>
    <title>HTML5 SVG demo</title>
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
  </head>
 
  <body>
    <h1>HTML5 MathML Demo</h1>
    <p> Very simple formula: </p>
 
   <math xmlns="http://www.w3.org/1998/Math/MathML">
     <mrow>
       <msqrt>
         <mn>49</mn>
       </msqrt>
       <mo>=</mo>
       <mn>7</mn>
     </mrow>
   </math>
 
  </body>
</html>

MathML as extra vocabulary in XHTML

<?xml version="1.0" encoding="iso-8859-1"?>
<xhtml:html xmlns:xhtml="http://www.w3.org/1999/xhtml">
 <xhtml:body>
   <xhtml:h1>A Compound Document</xhtml:h1>
   <xhtml:p>A simple formula using MathML in XHTML.</xhtml:p>
   <mathml:math xmlns:mathml="http://www.w3.org/1998/Math/MathML">
     <mathml:mrow>
       <mathml:msqrt>
         <mathml:mn>49</mathml:mn>
       </mathml:msqrt>
       <mathml:mo>=</mathml:mo>
       <mathml:mn>7</mathml:mn>
     </mathml:mrow>
   </mathml:math>
 </xhtml:body>
</xhtml:html>

http://tecfa.unige.ch/guides/xml/examples/mathml/xhtml_mathml.xml

Or if you prefer:

<?xml version="1.0" encoding="iso-8859-1"?>
<html xmlns="http://www.w3.org/1999/xhtml">
 <body>
   <h1>A Compound Document</h1>
   <p>A simple formula using MathML in XHTML.</p>
   <math xmlns="http://www.w3.org/1998/Math/MathML">
     <mrow>
       <msqrt>
         <mn>49</mn>
       </msqrt>
       <mo>=</mo>
       <mn>7</mn>
     </mrow>
   </math>
 </body>
</html>

http://tecfa.unige.ch/guides/xml/examples/mathml/xhtml_mathml_2.xml

MathML validated by a combined XHTML/MathML DTD

If your browser supports XHTML and MathML (e.g. Firefox) a less simple example would look like this:

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1 plus MathML 2.0//EN" 
         "http://www.w3.org/TR/MathML2/dtd/xhtml-math11-f.dtd" >
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:math="http://www.w3.org/1998/Math/MathML"
      xmlns:xlink="http://www.w3.org/1999/xlink">
<head> <title>XTHML with MATHML</title> </head>
<body>
 <p> 
   <b>Corollary 2</b> [Contractive Sequence Theorem] <em>If
   <math xmlns='http://www.w3.org/1998/Math/MathML'><mo>(</mo><msub><mi>x</mi> <mi>n</mi></msub><mo>)</mo></math> is a sequence, 
    for which there is a number 
    <math xmlns='http://www.w3.org/1998/Math/MathML'>
          <mi>C</mi><mi><</mi><mn>1</mn></math>
     such that 
     <math xmlns='http://www.w3.org/1998/Math/MathML'>
       <mo>|</mo><msub><mi>x</mi> <mrow><mi>n</mi><mo>+</mo><mn>2</mn></mrow></msub>
       <mo>-</mo>
       <msub><mi>x</mi><mrow><mi>n</mi><mo>+</mo><mn>1</mn></mrow></msub>
       <mo>|</mo><mo>≤</mo><mi>C</mi><mo>⋅</mo><mo>|</mo>
       <msub><mi>x</mi> <mrow><mi>n</mi><mo>+</mo><mn>1</mn></mrow></msub>
       <mo>-</mo>
       <msub><mi>x</mi> <mi>n</mi></msub><mo>|</mo></math>, 
     then <math xmlns='http://www.w3.org/1998/Math/MathML'><mo>(</mo><msub><mi>x</mi> <mi>n</mi></msub><mo>)</mo>
    </math>   
    converges;</em></p>
</body>
</html>

Click here to see if your browser can handle it.

IE explorer hack

You also can make MathML/XHTML integration work by installing a a free stylesheet (read the whole article and copy the files to your server).

Example MATHML with an XSLT trick for IE
<?xml version="1.0"?>
<?xml-stylesheet type="text/xsl" href="pmathml.xsl"?>
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:pref="http://www.w3.org/2002/Math/preference"
      pref:renderer="css">
 <head>
   <title>MATHML with an XSLT trick for IE</title>
 </head>
     
 <body>
   <h1>MATHML with an XSLT trick for IE</h1>
 <p>Below is an equation with a radical:</p>
 <math xmlns="http://www.w3.org/1998/Math/MathML">
  <msup>
   <msqrt>
     <mrow>
       <mi>a</mi>
       <mo>+</mo>
       <mi>b</mi>
     </mrow>
   </msqrt>
   <mn>27</mn>
  </msup>
 </math>
</body>
</html>

Plugins

Plugins are not the way to go, but you can, e.g. see the W3C MathML software List

Links

Standards

Examples

Software

(Note: Daniel K. Schneider didn't test any of these, so there is no endorsement).

Indexes
Commercial editors
Other commercial tools that support MathML to various Extents
Other free tools
  • Open Office has a Math Module.
  • The Amaya Web Browser
Plugins
  • Mplayer Free plugin from Design Science.

Tutorials and Overviews