目次
MathML とは？
正確のため原文を引用します。
What is MathML?
MathML is a formal language for expressing mathematics. It is based on XML to be compatible with a large range of software products.W3C published the first version of MathML in 1998. MathML was updated and expanded in 2003. The third version, which adds, among other things, support for right-to-left languages, elementary (“school”) math, and integration of the OpenMath content dictionaries, is expected in 2009/2010.
MathML は数学（数式）を表現するための正式な言語で、XMLに基づいており、幅広いソフトウェア製品と互換性があります。
Web技術の標準化を推進する団体W3C（※1）は、1998年に MathML の最初のバージョンを発表しました。そこから MathML はアップデートと拡張を重ね、2018年1月時点での最新バージョンは 3（MathML3）となっています。
公式ウェブサイト： https://www.w3.org/Math/
MathML3 のドキュメント： https://www.w3.org/TR/MathML3/
W3C は World Wide Web Consortium の略称で、ダブリュー・スリー・シーと読みます。HTML5 / CSS3 をはじめ、WEB技術の標準化を推進している、とても権威のある団体です。
はじめての MathML
まずはサンプルを見てみましょう。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 |
<!DOCTYPE html> <html> <head> <title>Getting Started MathML</title> <script async src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=TeX-MML-AM_CHTML"></script> </head> <body> <h1>Example</h1> <math> <mi>x</mi> <mo>+</mo> <mn>5</mn> <mo>=</mo> <mn>7</mn> </math> </body> </html> |
これで HTML5 で記述された Webページの中に一次方程式を表示することができます。
5行目の <script … という箇所で MathJax を読み込んでいます。ここでは <head> タグ内で読み込んでいますが、<body> の中で読み込んでも大丈夫です。もし MathJax について不明なら Webページに数式を表示する方法を徹底解説 – 導入編 – を参照ください。
9行目〜15行目 <math> から </math> の箇所が数式に該当します。ここでは1つだけですが、<math> タグは1つのHTMLの中に複数設置できます。
Webページに数式を記述する手順のまとめ
- MathJax を読み込む
- 数式を表示したい箇所に <math> タグを設置する
- <math> タグの中に MathML で数式を記述する。
まずは3つのタグを覚える
サンプルのように MathML では数字や変数といった要素を別々のタグで囲います。HTML5 同様に MathML にも様々なタグがありますが <mn>、<mo>、 <mi> の3つのタグを覚えましょう。
<mn>（数値）
数値の要素を表示するには <mn> タグを使います。0, 1, 2, 1.5, 7.33 のような数値以外に「eleven」のような「Ⅶ」のような数量を表すテキストにも使います。mn は Math Numberの略。
<mo>（演算子）
演算子（+, – など）、 括弧（( ), { }, [ ]など）、絶対値の縦棒といった（かなり広義の）演算子を表示するのに使います。mo は Math Operatorの略。
<mi>（識別子）
変数（x, y など）、関数名（sin, cos など）、記号定数（πなど）など（かなり広義の）識別子を表示するのに使います。mi は Math Identifierの略。
豆知識 – 2つのMathML –
MathML には「プレゼンテーションMathML」と「コンテンツMathML」の2つの方式があります。
MathML で数学をマークアップするには、2つの方法があります: プレゼンテーション MathML は、方程式のレイアウトを制御するために使用されるのに対して、コンテンツ MathML は、セマンティックな数学的意味をエンコードし、かつ数式処理システムに式を理解しやすくするように設計されます。
developer.mozilla.org より引用
Webページでの表示用途では多くの場合「プレゼンテーションMathML」が用いられます。この記事でも特に明記しない限り、プレゼンテーションMathML を単に MathML としています。
四則演算
数式の基本中の基本、四則演算についてサンプルをまじえて見ていきましょう。
加法（足し算）
|
1 2 3 4 5 |
<math> <mi>x</mi> <mo>+</mo> <mn>1</mn> </math> |
減法（引き算）
|
1 2 3 4 5 |
<math> <mi>x</mi> <mo>−</mo> <mn>1</mn> </math> |
上記のように厳密なマイナス記号は − で表記しますが、下記のように – （ハイフンマイナス）でも問題ありません。入力が簡単ということもあり – （ハイフンマイナス）が使われることの方が多いようです。
|
1 2 3 4 5 |
<math> <mi>x</mi> <mo>-</mo> <mn>1</mn> </math> |
乗法（掛け算）
|
1 2 3 4 5 |
<math> <mi>x</mi> <mo>×</mo> <mn>1</mn> </math> |
掛け算は × で表記しますが、中学数学以降は 3x や 3a のように × を省略するのが一般的でしょう。× の省略は次のように2パターンの書き方があります。
|
1 2 3 4 5 6 |
<math> <mn>3</mn> <mi>x</mi> <mo>+</mo> <mn>1</mn> </math> |
|
1 2 3 4 5 6 7 |
<math> <mn>3</mn> <mo>⁢<!--INVISIBLE TIMES--></mo> <mi>x</mi> <mo>+</mo> <mn>1</mn> </math> |
3行目の ⁢ というコードはブラウザには何も表示されませんが、INVISIBLE TIMES （目に見えない乗算）という数学的な意味を持ちます。どちらでも表示上の問題ありませんが、⁢ を入れる方がより正確な書き方です。
除法
|
1 2 3 4 5 |
<math> <mi>x</mi> <mo>÷</mo> <mn>3</mn> </math> |
除法（割り算）は ÷ で表記できますが ÷ を書くのは「算数」までで、「数学」では分数として表記するのが一般的でしょう。分数は <mfrac> というタグを使います。※mfrac は Math Fraction の略。
|
1 2 3 4 5 6 |
<math> <mfrac> <mi>x</mi> <mn>3</mn> </mfrac> </math> |
分数を斜線で表記したいなら <mfrac> タグの bevelled 属性値に true を指定します。
|
1 2 3 4 5 6 |
<math> <mfrac bevelled="true"> <mi>x</mi> <mn>3</mn> </mfrac> </math> |
数学記号や文字
± ≠ ≥ ∑ ∫ π ∞
これらはほんの一例ですが、数学（数式）には様々な記号や文字があります。これらを文字化けすることなく表示するには、数値文字参照または文字実体参照（参考ページ）を使わなければなりません。
入力したくてもコードがわからない場合には、下記ページが頼もしい味方になってくれるでしょう。
具体的なサンプル
以上で MathML の入門は終わりです。次の記事で分数、平方根（ルート）、行列、積分などのサンプルを見ていきましょう。
コメントを残す