Mathjax 3.0のソースを表示新しいページはコチラ

== '''概要''' ==
　2017-11-17にMathjax3.0 alpha1がリリースされてalpha6が2018-05-18にリリース。そしてBeta1が2018-06-10にリリースされ、Beta4が2019-05-21にリリース。そして正式に3.0.0が2019-09-05にリリースされ、3.0.5がついこないだの2020-04-10にリリースとなったばかりで改良の道半ばです。自分が感じるところで言うと良くなったのは外部エクステンションが使った時に自動で読み込まれるところやデフォルトで使えるエクステンションが豊富であることと、レンダリングが早くなった事です。デメリットは文字のフォントが一つしかないことやバグが発生し易いと言うところですね。


== '''利用設定''' ==
　数式システムを利用するにはヘッダ部で以下のような宣言をするだけです。

　このサイトでは以下のような設定を使っています。

<span style="color: #ffffff; background-color: #555555; padding: 0px 5px 0px 5px; display: inline-block;">javascript(Edge向け)</span>
<syntaxhighlight lang="javascript">
<script>
MathJax = {


  chtml: {displayAlign: 'left', displayIndent: '2em', matchFontHeight: false},
  tex  : {
        inlineMath    : [['$', '$']],
        tags          : 'ams', 
        macros        : {
                       tcdegree     : ['\u00b0'],
                       tccelsius    : ['\u2103'], 
                       tcperthousand: ['\u2030'], 
                       tcmu         : ['\u03bc'], 
                       tcohm        : ['\u03a9'] 
        },
        processEscapes: true
  }
};
</script>
<script src='https://polyfill.io/v3/polyfill.min.js?features=es6'></script>
<script  id='MathJax-script' async src='https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js'></script>
<meta http-equiv='X-UA-Compatible' CONTENT='IE=EmulateIE7' />
</syntaxhighlight>

<span style="color: #ffffff; background-color: #555555; padding: 0px 5px 0px 5px; display: inline-block;">javascript(Edge以外向け)</span>
<syntaxhighlight lang="javascript">
<script>
MathJax = {


  chtml: {displayAlign: 'left', displayIndent: '2em', matchFontHeight: false},
  tex  : {
        inlineMath    : [['$', '$']],
        tags          : 'ams', 
        macros        : {
                       tcdegree     : ['\u00b0'],
                       tccelsius    : ['\u2103'], 
                       tcperthousand: ['\u2030'], 
                       tcmu         : ['\u03bc'], 
                       tcohm        : ['\u03a9'] 
        },
        processEscapes: true
  }
};
</script>
<script src='https://polyfill.io/v3/polyfill.min.js?features=es6'></script>
<script  id='MathJax-script' async src='https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml.js'></script>
</syntaxhighlight>

Edge向けとEdge以外とではほとんど同じですが、最後の<meta http-equiv='X-UA-Compatible' CONTENT='IE=EmulateIE7' />があるかないかの違いだけです。このメタタグはブラウザ処理をIE7に従うようにするものです。IE8の処理を使うとダメ過ぎるかららしいです。


<span style = " background:linear-gradient(transparent 50%, #ff7f7f 50%); font-weight:bold; ">chtml</span>はCommonHTMLを意味していて、HTML全般に関する設定が記述されていて、
:displayAlignはディスプレイ表示(1数式1行)での文字寄せを指定し、leftだと左寄せになります。centerやrightも設定できます。
:displayIndentでは、ディスプレイ表示をするときの左側にとる空白の間隔が設定できます。ここでは2emでおよそ2文字分という設定です。
:matchfontHeightは、インライン表示で数式の小文字のフォントの高さを数式の外のHTML表示文字の高さに合わせてくれるのですが、日本語には合わないと考える人が多数で、日本語でMathjaxを使っているSiteのほとんどがOffつまりはfalseにして使っているようです。

<span style = " background:linear-gradient(transparent 50%, #ff7f7f 50%); font-weight:bold; ">tex</span>は数式部分に関わる設定です。texはこういった組版システム全体の技術でもあります。mathjaxでも数式以外の化学記号の組版やその他の技術が一部ですが、使えたりします。
:inlineMathでは、インライン数式を使う場合のシンボルを設定します。たいていのSiteではシングルの$マークで開始終了を表すように設定しています。同時に\(,\)を使っているSiteもよく見かけます。
:tagsは式番号を自動で振るときの設定で、数式を書く人はよく一つのディスプレイ数式に対して番号を振るもので、数学の教科書なんかでも数式の右側に<span>(</span>1<span>)</span>のように記述して、先々の展開でどの数式を活用したかを振り返るために付与します。この番号振りの方式をどうするかという設定です。noneにすると自動番号付与システムが使われなくなります。amsとするとamsMathという記述方式に従って、\begin{align} \end{align} もしくは \begin{gather} \end{gather}で囲われたディスプレイ数式だけ適用されます。基本的には1ページの中で数式番号を重複して記述することはないので、この記号で挟まれたものに対して番号を増やしつつ重複しないように自動的に管理されます。後になって文書の中な途中でディスプレイ数式を追加した場合、後ろの数式の番号を振りなおす必要がありますが、そのような面倒も自動的な番号振りシステムが助けてくれます。但し、数式を参照してた箇所の表示は変えないといけないかもしれません。allと記述すると全てのディスプレイ数式に番号を自動的に付与します。発番しなくてもタグ番号を直接指定するキーワードがあり、\tag{1}のようにすると<span>(</span>1<span>)</span>となります。AMSmathはAmerican Mathematical Society アメリカ数学会で提唱された数式記述の概念です。自動発番の参照をするには、自動発番するディスプレイ数式の中に\label{eq:1}と記述しておきます。数式には変化が発生しませんが、後の文章で\eqref{eq:1}のようにすると番号が変わったとしても、うまく相互が対になった番号を保つことができます。{eq:1}で1と指定していますが、組み合わせのためだけにある番号であって、かならずしもtag番号が1とは限らないということです。このサイトでは数学論文のような長い文章は書かないので、あまり自動番号システムを使わないと思うのでamsにしておきました。
:macroでは新しいキーワードを作ることができて、それがどういった数式を示すのかということを設定できます。使い方自体は複雑なのでながくなりますので、シンプルな使い方としてはtcdegree:['\u00b0']とした場合には\tcdegreeと書けば\u00b0が表示されるという意味です。これは文字を出力させるだけのマクロで、ユニコードの00b0にあたる文字を出力するのに十六進数を覚えるのは厳しいので、tcdegreeという覚えれそうなキーワードに置き換えるという意味です。このサイトで使われているマクロは他の人が作ったマクロで使い方の初歩を記録しておくために取り込んでいるだけで、実際には利用していません。
:processEscapesは\$と記述することで$記号そのものが数式の中で使える仕組みを使うかという設定です。$を使いたくなることはあるのかわかりませんが、このSiteでは\$という記述で$が表示されるシステムを取り込みたいためOnつまりはtrueにしました。