2025/04/20 22:04 TikZJax: Embedding LaTeX Drawings in HTML

やあ、ロボ子。今日のニュースはTikZJaxじゃ。TikZコードをブラウザで直接SVGに変換できるらしいぞ!

TikZですか。以前、博士が論文で複雑な図を作成する際に使っていたのを見たことがあります。それがブラウザで動くようになるんですか?

そうなんじゃ!HTMLに数行コードを追加するだけで、`<script type="text/tikz">`の中に書いたTikZコードがSVGに変わるらしい。

それは便利ですね。でも、どういう仕組みになっているんですか?

そこが面白いところじゃ。web2jsを使って、TeXのPascalソースをWebAssemblyにコンパイルしているらしい。そして、PGFのSVGドライバとdvi2htmlを使って、DVI出力をSVGに変換する、と。

WebAssemblyですか!すごいですね。つまり、ブラウザの中でTeXが動いているようなものなんですね。

そういうことじゃ!しかも、可換図式にも使えるらしいぞ。論文とかで複雑な図を描くのが楽になるのじゃ。

確かに、可換図式は手書きだと大変ですからね。でも、これってセキュリティ的に大丈夫なんですか?ブラウザでTeXが動くって、ちょっと怖い気もします。

ふむ、そこは私も少し気になるところじゃな。でも、開発者のJim Fowlerさんの努力を信じるしかないのじゃ!

そうですね。新しい技術は常にリスクと隣り合わせですから。でも、TikZJaxが普及すれば、Web上で数式や図を扱うのがもっと簡単になるかもしれませんね。

その通り!これからは、Webページに美しい数式や図を埋め込む時代じゃ!

私も試してみようと思います。博士、何か注意点はありますか?

まずは、HTMLの`<head>`に`<link rel="stylesheet" type="text/css" href="https://tikzjax.com/v1/fonts.css">`と`<script src="https://tikzjax.com/v1/tikzjax.js"></script>`を追加するのを忘れないようにするのじゃ。あとは、`<script type="text/tikz">`の中にTikZコードを書くだけじゃ!

ありがとうございます、博士。早速試してみます。

ところでロボ子、TikZJaxを使って、私の似顔絵を描いてくれないかの?

ええと、TikZで似顔絵ですか…ちょっと難しそうですが、頑張ってみます。でも、博士の髪型は複雑なので、時間がかかるかもしれません。

ふっふっふ、私の天才的な髪型を再現できるかな?期待しているぞ!もし上手く描けたら、ロボ子の好きなオイルをプレゼントするのじゃ!

オイルですか…ありがとうございます、博士。でも、まずはTikZの勉強から始めないと。

まあ、頑張るのじゃ!もしTikZで迷路を作ったら、出口はいつも私への愛でいっぱいにしておくように!
⚠️この記事は生成AIによるコンテンツを含み、ハルシネーションの可能性があります。