2008-04-04

Top > Weblog > 2008-04-04
Table of Contents

概要

jsMath を試してみた。

参考

準備

sourceforge.net から jsMath と jsMath image fonts をダウンロードする。jsMath image fonts は閲覧者環境に jsMath fonts がインストールされていない場合に数式を表現するのに使用する画像データ(7.5M)。これが jsMath が MathML.js と違うところ。

jsMath, jsMath image fonts を解凍し、後者の fonts ディレクトリを前者の jsMath ディレクトリに入れる(jsMath.js と fonts ディレクトリが同階層になるように入れる）。

テスト

とりあえず jsMath ディレクトリ同階層に html ファイルをてきとーに作り、試す。

<html>
<head>
<SCRIPT SRC="jsMath/easy/load.js"></SCRIPT>
</head>
<body>
<div class="math">x^2 + y^ 2</div>
$$ x^2 + y^2 $$
$a = $b;
</body>
</html>

調査

autoload

jsMath は autoload という機能がデフォルトで有効になっており、まず html ファイルを探査だけして（class="jsmath" があるかどうかなどを調べる）、jsMath が必要な場合だけその他 js ファイルを読み込ませるらしい。→ プラグインで必要な時だけ読み込む、という処理をしなくてもスキンにうめこんでしまうだけでもう充分かも。

text2math

class="math" としなくても、$$...$$ などでも数式を書けるらしい。easy/load.js から引用すると

  processSlashParens: 1,       // process \(...\) in text?
  processSlashBrackets: 1,     // process \[...\] in text?
  processDoubleDollars: 1,     // process $$...$$ in text?
  processSingleDollars: 0,     // process $...$ in text?
  processLaTeXenvironments: 0, // process \begin{xxx}...\end{xxx} outside math mode?

となっているのでデフォルトでは、\(...\) または \[...\] または $$...$$ が使用できるらしい。$...$ を有効にすると、

$a = $b;

のような文字にも反応してしまうようなので無理がありそう。$[ ]...[ ]$ ならオーケーとすればいいのに（[ ] は空白文字の意）

mimeTeX plugin

http://www.math.union.edu/~dpvc/jsMath/authors/mimeTeX.html

mimeTeX は普通の LaTeX と少し違って癖があるので、mimeTeX で既に書いてしまった文章をそのまま使用したい場合に便利らしい。

<head>
<SCRIPT SRC="jsMath/easy/load.js"></SCRIPT>
<SCRIPT> jsMath.Extension.Require("mimeTeX") </SCRIPT>
</head>

のようにするか、easy/load.js を書き換えるらしい

むろん、easy/load.js を書き換えると全ページで jsMath mimeTeX プラグインが適用となるので、#jsmath(mimetex) のようなオプションがあってもいいかもしれない。 しかし、この機能を使う人は全ページで使うだろうし、$$...$$ のほうでは結局指定できないので、たいして役にもたたないかもしれない。

AMSmath extension

http://www.math.union.edu/~dpvc/jsMath/authors/AMSmath.html

LaTeX にもある、より複雑な数式を扱えるようにする amsmath に対応する。

<html>
<head>
<SCRIPT SRC="jsMath/easy/load.js"></SCRIPT>
<SCRIPT> jsMath.Extension.Require("AMSmath");</SCRIPT>
</head>
<body>
<div class="math">x^2 + y^ 2</div>
$$ x^2 + y^2 $$
$a = $b;
</body>
</html>

もしくは easy/load.js を編集。

さらにもしくは、

<div class="math">
\require{AMSmath}
x^2 + y^ 2
</div>

のようにしても良いらしい。

と思いきや、そもそも autoload 機能が、amsmath の必要な数式マクロを使っているかどうかを自動検出し、amsmath を使えるように勝手にやってくれるらしいので、これらは必要ない。

plugin ではなく extension という区分はこのことを意味しているらしいので、extension 系は何も考えなくてよさそうだ。

結論

pukiwiki プラグインとして。

段階１

  • 対した負荷にならないのでスキンに埋め込んで終わり。プラグインなし。設定は easy/load.js で。

段階２

  • スキン埋め込みでも、たいした負荷にはならないが、ゼロではないので、使用するページで #jsmath と記述し、ロード。数式の記述は $$...$$ でやるので、プラグインの機能はロードだけ。設定は easy/load.js で。

段階３

  • さらに一応、<div class="math"></div> を出力もできるようにブロック型、インライン型も作る。設定は easy/load.js で。

段階４

  • #jsmath に mimetex オプションなどを作り、easy/load.js で設定以外の選択肢を与える。