Mathjax 2.7

MathJaxに戻る。

概要

　2018-04-03にmathjax2.7.4が最後に更新されたのが最後ですが、現在のVersion3と機能のほとんどは使えます。やりたいことをやろうとすると少し手順が多いというデメリットはあるものの、できないということは少ないはずです。なんといってもNeo Euler ネオオイラーフォントが使えるのはありがたいですよね。オイラーフォントはHermann Zapf(ハーマン ザフ)さんが使ったもので AMS Euler > Neo Eulerのように更新されています。AMS Eulerはもう入手困難です。とはいってもmathjaxではWebフォントを使いますので、選べません。Neo Euler一択です。

　

Checking environment...

　Version2.0系に関する記事です。現在の2.0系最新バージョンは

　

Loading MathJax version...

　です。

　

利用設定(基本的な部分)

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

　このサイトではVersion2.7.4 と 3.0.4を使い分けていて、2.7の場合は以下のような設定を使っています。

javascript(全ブラウザ共通)

<script src='https://cdn.jsdelivr.net/npm/mathjax@2/MathJax.js?config=TeX-AMS_HTML-full'>
  MathJax.Hub.Config({
    "fast-preview": {disabled:true},
    tex2jax: {
      preview: "none",
      inlineMath: [['\\@','\\@'],['\\(','\\)']],
      displayMath: [['$$','$$'],['\\[','\\]']],
      skipTags: ["code"],
      processEscapes: true
    },
    "TeX": { 
      extentions:["color.js", "cancel.js"],
    },
    "HTML-CSS": {
      availableFonts: [],
      preferredFont: null,
      webFont: "Neo-Euler"
    },
  });
</script>

Extensionについては、複数を使う時、公式ページでは上記のように記述しろとなっているのだけれど、2つめ以降がうまく取り込まれないみたい。なので、面倒だけどページごとに \$ \require{cancel} \$ と、エクステンションの機能を使う直前に記述して対応します。なんすかね。これ。でもそのページで一回、記述すれば、それ以降はずっとそのページでExtensionが適用されるみたいなので、よしとします。

使用例　\$ \require{cancel} \$

mathjax

$ \require{cancel} $ 
$$ f(x)= \int^{\infty}_{-\infty}\color{red}{\frac{1}{\sqrt{2\pi}\sigma \cancel{\sigma} }}e^{-\frac{1}{2\sigma^2}(x-\mu)^2} $$

確率密度関数 $$ \require{cancel} f(x)= \int^{\infty}_{-\infty}\color{red}{\frac{1}{\sqrt{2\pi}\sigma \cancel{\sigma} }}e^{-\frac{1}{2\sigma^2}(x-\mu)^2} $$

Neo Eulerフォントの利用

　以下の指定でNeo Eulerフォントが使えます。拡張機能についてはMathjax2.x 設定で説明しています。拡張機能は使わなくてもEulerフォントは使えますので、必要ない場合は記述しなくて良いです。

<script type="text/x-mathjax-config">
  MathJax.Ajax.config.path["Contrib"]="https://(あなたのドメインで設定して下さい)/mathjax/";
  MathJax.Hub.Register.StartupHook("TeX Jax Ready",function (){
    MathJax.Hub.Insert(
      MathJax.InputJax.TeX.Definitions.macros,{
        cancel: ["Extension","cancel"], 
        bcancel: ["Extension","cancel"], 
        xcancel: ["Extension","cancel"], 
        cancelto: ["Extension","cancel"]
      }
    );
  }); 
  MathJax.Hub.Config({
    tex2jax:{
      displayMath: [['$$', '$$'],['\\[', '\\]']],  //displayスタイル数式に利用する記号の指定
      inlineMath:  [['\\@', '\\@'],['\\(', '\\)']],//inlineスタイル数式に利用する記号の指定
                                                   //ここは使う人が自由に設定する部分です。
      processEscapes: true
    },
    TeX:{
//    equationNumbers:{autoNumber: "AMS"}, 
      extensions: ["[Contrib]/physics/physics.js","[Contrib]/siunitx/siunitx.js", "color.js", "cancel.js"]
    },
    "HTML-CSS": {
      availableFonts: [],
      preferredFont: null,
      webFont: "Neo-Euler"
    },
  });
</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.9/MathJax.js?config=TeX-AMS_HTML-full"></script>

以下は、無理矢理適用する方法

１．まずNeo EulerのWebfontを入手します。https://font.download/font/neo-eulerの@Download @Font Face Kitの方をダウンロードします。

２．解凍したファイル群の中のEuler.woffファイルを自分のWebサーバにアップロードします。

３．数式を使うページのCSSに以下のコードを埋め込みます。

@font-face {
    font-family: 'Neo Euler Medium';
    src: url('./font/euler.woff') format('woff');
}

./font/euler.woffの部分は、自分のサイトにおける、数式を使うページからeuler.woffファイルへの相対アドレスか絶対アドレスを入力します。

４．数式を使うページの最初の宣言とコンフィグを以下のように設定します。

<script src='https://cdn.jsdelivr.net/npm/mathjax@2/MathJax.js?config=TeX-AMS_HTML-full'>
  MathJax.Hub.Config({
    "fast-preview": {disabled:true},
    tex2jax: {
      preview: "none",
      inlineMath: [['\\@','\\@'],['\\(','\\)']],
      displayMath: [['$$','$$'],['\\[','\\]']],
      skipTags: ["code"],
      processEscapes: true
    },
    "HTML-CSS": {
      undefinedFamily: "'Neo Euler Medium', Meiryo, STIXGeneral, 'Arial Unicode MS', serif",
      webFont :"Neo Euler Medium"
    }
  });
</script>

関連情報

• Mathjax2.x 設定

• MathJax バージョンチェック

• Mathjax2.x系 Neo Eulerフォントのサンプルページ

※コード一覧はLoadするのに時間がかかるページで処理も重たいです。MathJaxで描画したものを固定値に変換していますので、Highlight.jsによるTeXコード描画にだけ時間がかかる状態になっています。Edgeで30秒～40秒くらいかかります。他のブラウザだともう少し早いです。ただしデータ量が多いのでアクセスするのに5秒くらいかかるかも。コードの元ネタはコチラのサイトです。https://easy-copy-mathjax.nakaken88.com/ こちらは、義務教育～高校の算数～数学が網羅されている先端的・先鋭的なサイトです。

• Mathjax2.x コード一覧 Texフォント

• Mathjax2.x コード一覧 Neo-Eulerフォント

• Mathjax2.x コード一覧 Asana-Mathフォント

• Mathjax2.x コード一覧 Gyre-Pagellaフォント

• Mathjax2.x コード一覧 Gyre-Termesフォント

• Mathjax2.x コード一覧 Latin-Modernフォント

• Mathjax2.x コード一覧 STIX-Webフォント

• Mathjax2.x コード一覧 ※無理矢理Eulerフォント

• Mathjax2.x 練習場

• Mathjax2.x 開発

　

MathJaxに戻る。