数式したい（MathJax）

1[project]
2extra_javascript = [
3    "javascripts/mathjax.js",  # docs/javascripts/mathjax.jsに作成
4    "https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js",
5    # "https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-chtml-full.js",  # physicsパッケージ記法を使う場合
6]
7
8[project.markdown_extensions]
9pymdownx.arithmatex.generic = true

 1// docs/javascripts/mathjax.js
 2window.MathJax = {
 3  tex: {
 4    inlineMath: [["\\(", "\\)"]],
 5    displayMath: [["\\[", "\\]"]],
 6    processEscapes: true,
 7    processEnvironments: true
 8  },
 9  options: {
10    ignoreHtmlClass: ".*|",
11    processHtmlClass: "arithmatex"
12  }
13};
14
15document$.subscribe(() => {
16  MathJax.startup.output.clearCache()
17  MathJax.typesetClear()
18  MathJax.texReset()
19  MathJax.typesetPromise()
20})
21
22component$.subscribe(({ ref }) => {
23  if (ref.classList.contains("md-annotation"))
24    MathJax.typesetPromise([ref])
25})

MathJaxは、ウェブ上で数式を表示するためのJavaScriptライブラリです。 zensical.tomlのextra_javascriptに設定を追加することで、Zensicalでも使うことができます。

プロジェクト内にmathjax.jsを作成して、window.MathJaxに設定を追加することで、ページ内の数式を自動的にレンダリングできるようにします。

リファレンス