#title 모니위키에서 LaTeX 표현 방법

과거에는 MoniWiki 자체에서 서버 사이드 TeX 렌더링을 제공하는 플러그인이 있었지만, 최근에는 MoniWiki의 틀에 얽매이기보다 최신 웹 환경에서 TeX 수식을 표현할 수 있는 클라이언트 렌더링 라이브러리인 '''MathJax 또는 KaTeX을 사용하는 편이 훨씬 편하다'''.

 > 1.3 The Game of the Name
 > (전략)
 > One of the hardest things about using [[html($\LaTeX$)]] is deciding how to pronounce it. This is also one of the few things I'm not going to tell you about [[html($\LaTeX$)]], since pronunciation is best determined by usage, not flat. [[html($\TeX$)]] is usually pronounced teck, making lah-teck, and lay-teck the logical choices; but language is not always logical, so lay-tecks is also possible.
 > (후략)
 > ― LaTeX: A Document Preparation System (1994), Leslie Lamport.

== KaTeX 설치 방법 ==
1. `config.php` `$extra_header`에 다음을 추가한다.
{{{#!vim html
<!-- KaTeX for LaTeX math rendering -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.css">
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/katex.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/katex@0.16.9/dist/contrib/auto-render.min.js"
        onload="renderMathInElement(document.body, {
          delimiters: [
            {left: '$$', right: '$$', display: true},
            {left: '$', right: '$', display: false}
          ]
        });">
</script>
}}}

2. KaTeX에서 동작 조건

KaTeX에서는 기본적으로 다음 두 가지 구문을 지원한다.
{{{#!markdown
| 구문          | 의미           | 모드     |
| ----------- | ------------ | ------ |
| `$ ... $`   | inline math  | inline |
| `$$ ... $$` | display math | block  |
}}}

일반적으로 다음 함수에서 LaTeX 구문이 자동 처리된다.
{{{
renderMathInElement(document.body, {
  delimiters: [
    {left: "$$", right: "$$", display: true},
    {left: "$", right: "$", display: false}
  ]
});
}}}

따라서 모니위키 본문에 LaTeX의 inline math {{{$ ... $}}} 또는 display math {{{$$ ... $$}}}를 출력해야 한다.

그런데 모니위키에서는 `$`가 ASCIIMathML 프로세서의 예약어로 잡혀 있다. (processor_repl('asciimathml', ...) -> ASCIIMathML.js // 클라이언트 측 변환)

그래서 다음과 같이 인라인 html 문법을 이용해서 모니위키 본문에 $을 출력하면 KaTeX을 사용할 수 있다:
{{{
[[html($$\sum_{n=1}^\infty a_n = \int_0^1 f$$)]]
}}}
[[html(\( a^2 + b^2 = c^2 \))]]
\( a^2 + b^2 = c^2 \)
$$
a^2 + b^2 = c^2
$$

== 예시 ==
[[html($$\sum_{n=1}^\infty a_n = \int_0^1 f$$)]]
[[html($$SSIM(x, y) = \frac{(2\mu_x\mu_y + C_1)(2\sigma_{xy} + C_2)}{(\mu_x^2 + \mu_y^2 + C_1)(\sigma_x^2 + \sigma_y^2 + C_2)}$$)]]
[[html($$\Delta E = \sqrt{(\Delta L^*)^2 + (\Delta a^*)^2 + (\Delta b^*)^2}$$)]]
----
CategoryNonClassified