MarkdownでLatex数式を正しく反映したPDF/HTMLを作成する with Mathjax（VScode，markdown-pdf）

4009 ワード
MathJax Markdown PDF Markdown テキストリンク

目的

VScodeでmarkdownを用いて数式を正しく表示したPDF，html資料を作成する。

実行環境はMarkdown All in Oneとmarkdown-pdfの拡張環境を導入したVScode（On Windows10）とします。

背景と課題

Latex数式をMarkdown上で表示する方法は多くの場合2通りに分類できます。（他にあったら教えて下さい。）

  • Katex を使用
  • Mathjax を使用

Markdown Previewと同じKatexを用いて表示したい場合はこちらの記事が参考になります。

課題として，Katexを使った場合

  • いくつかのLatex記法（例えば\align）が使えない
  • \newcommandなどのマクロ宣言を大幅に書き換える必要がある 参考例

など不都合が存在します。一方Katexが使われる理由としてはレンダリングが早いというのが挙げられるようです。

そこで，Katexの代わりにQiitaの数式表示などにも用いられているMathjaxを使用するようにします。

解決策

template.htmlの変更による変換時のMathjaxの有効化を用います。

テンプレートファイルを開く手順は，

  1. Cmd+Shift+Pでコマンドパレットを呼び出しExtensions: Open Extensions FolderでEnterする。
  2. yzane.markdown-pdf-x.x.x\templateのフォルダに移動する。
  3. template.htmlを開き，以下の文を追記する。
  <script type="text/javascript" src="http://cdn.mathjax.org/mathjax/latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
    <script type="text/x-mathjax-config">
        MathJax.Hub.Config({ tex2jax: {inlineMath: [['$', '$']]}, messageStyle: "none" });
    </script>

なお，場所はheadとbodyの間にいれましたが，多分どこでも良いはずです。
参考にしたQ&Aはこちら。

万が一変更しすぎてわからなくなった場合は，デフォルトのtemplateをGithubのページから落としてきます。

TODO

上田先生の詳解確率ロボティクスの授業スライドをPDFにしようとするのに使いました。

Previewで結果を確認できない合わない問題

  • MarkdownのPreviewがKatex準拠のままなのでPDFに変換するまで数式が出力されない問題があります。

Previewの見た目。（Katexのエラーが出る場所は見れない）

HTMLに変換した見た目

Mermaidやpumlを書く

仕様書などでumlなどを書くときに含めれたら良いなと思います。
Preview-enhancedならできるようなのでPDF化もできるのかなとは思っています。

参考

もっとも，そこまで求めるならasciidocで書いたほうが良いかもしれないですが…