From 7a51bdc6d461f5f76267d8a33f389559e5058a0b Mon Sep 17 00:00:00 2001 From: moris Date: Mon, 23 Dec 2024 16:38:00 +0900 Subject: [PATCH] =?UTF-8?q?=E7=B4=B0=E3=81=8B=E3=81=84=E4=BF=AE=E6=AD=A3?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- Posts/remark-math.md | 19 ++++++++++--------- 1 file changed, 10 insertions(+), 9 deletions(-) diff --git a/Posts/remark-math.md b/Posts/remark-math.md index 5dd8a9c..33bbfb0 100644 --- a/Posts/remark-math.md +++ b/Posts/remark-math.md @@ -34,8 +34,9 @@ e = mc^2 ``` ~~~ -サンプルコード + +## サンプルコード ```sh npm install remark remark-rehype rehype-stringify @@ -62,28 +63,28 @@ let html = remark() console.log(String(html)) ``` -Output: +### 実行結果 ```html

e=mc2e=mc^2

``` 実行するとhtmlが出てくるのですが、そのまま.htmlで保存してブラウザで開くと、ダブってるし片方は数式になっていません。 -これだけではダメでKaTeXでは追加のCSSを適用する必要があるのです。(MathJaxではCSSが一緒に出力されるので不要) +これだけではダメで、KaTeXでは追加のCSSを適用する必要があるのです。(MathJaxではCSSが一緒に出力されるので不要) なので以下のlinkタグを追加して再度開くと ```html ``` -![](https://moris.day/files/img/remark-math-e-mc2.webp) +![数式が正しく表示されている](https://moris.day/files/img/remark-math-e-mc2.webp) 数式として表示されました✨ ## オプション(MathMLで出力) KaTeXはhtml(+css)とMathMLという形式の出力に対応しています。 MathMLとは簡単にいうとSVGの数式版のようなもので、数式を記述するためのxmlマークアップです。 -SVGと同様にwebブラウザで表示が可能ですが最近まではサポートが微妙だったため現時点ではMDNでもNEWLY AVAILABLEとなっています。(https://developer.mozilla.org/ja/docs/Web/MathML) +SVGと同様にwebブラウザで表示が可能ですが、最近までブラウザサポートが微妙だったため、MDNではNEWLY AVAILABLEとなっています。https://developer.mozilla.org/ja/docs/Web/MathML -KaTeXではhtmlのみを出力、MathMLのみを出力、htmlを表示してMathMLをアクセシビリティのために不可視で付ける、の3種類が選択可能で3つ目がデフォルトになっています。(ちなみにcssをつけないとダブるのはこのためです。) -自分はcssを付けたくなかったためMathMLにしました。そのため以下のようにオプションを設定しています。 +KaTeXでは、htmlのみを出力、MathMLのみを出力、htmlを表示してMathMLをアクセシビリティのために不可視で付ける、の3種類が選択可能で、3つ目がデフォルトになっています。(ちなみにcssをつけないとダブるのはこのためです。) +自分はcssを付けたくなかったためMathMLにしました。そのため、以下のようにオプションを設定しています。 ```js .use(rehypeKatex, {output:'mathml'}) ``` @@ -102,7 +103,7 @@ $$ x = \frac{-b\pm \sqrt{b^2-4ac}}{2a} $$ -クーロンの法則 +二乗の和 $$ -F=k_0{q_1q_2 \over r^2} = {1 \over 4\pi\epsilon_0}{q_1q_2 \over r^2} +\sum_{k=1}^nk^2=\frac{1}{6}n(n+1)(2n+1) $$ \ No newline at end of file