1. Asciidoctorの数式を表現するためのAttribute:stem:の動作を確認

Asciidoctorで数式を表現する方法は確認ずみ。Attributeに:stem:を指定することで数式を表現できることを試しました。

今回はAttribute:stem:の動作を確認を確認します。指定した場合と指定しない場合の出力を比較してみます。

2. なぜ動作確認する必要があるのか?

私はHUGO上でAsciidoctorでブログ記事を書いています。HUGOのAsciidoctorは記事の内容以外の修飾的な出力は抑える設定になっています。

:stem:の動作によってはHUGO上のAsciidoctorで数式表現を実現する方法が変わる可能性があります

もし、:stem:によってHTMLタグに特定のClassを指定している場合にはCSSをカスタマイズする必要があります。

HTMLタグに影響を与えていなければCSSをカスタマイズする必要はありません。

このような状況から動作確認の必要性が生じました。

3. 確認方法

  1. :stem:を指定したドキュメントと指定しないドキュメントを作成

  2. 各々についてAsciidoctorでHTML出力

  3. 各出力結果のdiffを確認

3.1. :stem:を指定したドキュメントと指定しないドキュメントを作成

stem.adoc
:stem:

stem:[ \int_-\infty^\inftyN(x|\mu,\sigma^2)dx =1 ]
nostem.adoc
stem:[ \int_-\infty^\inftyN(x|\mu,\sigma^2)dx =1 ]

3.2. 各出力結果のdiffを確認

そしてHTMLに変換後のdiffの結果が以下となります。

diff.txt
434,449d433
< <script type="text/x-mathjax-config">
< MathJax.Hub.Config({
<   messageStyle: "none",
<   tex2jax: {
<     inlineMath: [["\\(", "\\)"]],
<     displayMath: [["\\[", "\\]"]],
<     ignoreClass: "nostem|nolatexmath"
<   },
<   asciimath2jax: {
<     delimiters: [["\\$", "\\$"]],
<     ignoreClass: "nostem|noasciimath"
<   },
<   TeX: { equationNumbers: { autoNumber: "none" } }
< });
< </script>
< <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.6.0/MathJax.js?config=TeX-MML-AM_HTMLorMML"></script>

HTMLタグにクラスを追加するような動作はしていません

MathJaxに関するJavaScriptを追加で生成しているところが異なっています

4. まとめ

:stem:の動作を確認しました。

HUGO上のAsciidoctorで数式を表現したい場合にはMathJaxの関するJavaScriptを自前で指定することで実現できそうです。またこの場合には:stem:を指定する必要はありません。

ただし、:stem:を指定する必要はありませんが、HUGO上ではなく他の環境に移植することを考慮すると:stem:は指定しておいた方が良いでしょう。

今回は:stem:の動作について調べて理解が深まりました。HUGOのテーマ作成のヒントになりそうです。

今回は以上です。