論文やグラフィックスの記事を読んでいて、数式が出てきたところで手が止まった経験はありませんか。
自分は独学でゲームやグラフィックスのプログラミングをやってきましたが、数式の壁には何度もぶつかりました。Σが出てきたらページを閉じる。∇が出てきたら「自分には早い」と思う。でも振り返ると、問題は数学の才能じゃなくて、翻訳表がなかったことでした。コードに直せば、たいていは見慣れた形になるんです。
そんな翻訳表として、Math as Code のインタラクティブ版を公開しました。
https://mathasacode.aulenor.com/
サイトのトップページ。58トピックを左の目次からたどれます。
数式とコードを並べて読む
このリファレンスのやり方はシンプルで、数式の横にいつも JavaScript のコードが並んでいます。たとえば総和の Σ は、
$$\sum_{i=1}^{100}i$$
コードに直すと、ただの for ループです。
var sum = 0
for (var i = 1; i <= 100; i++) {
sum += i
}
//=> 5050
内積も同じです。$\mathbf{k}\cdot\mathbf{j}$ と書かれると身構えますが、コードにすれば各成分を掛けて足すだけの関数です。
function dot(a, b) {
return a[0] * b[0] + a[1] * b[1] + a[2] * b[2]
}
結果が 0 なら 2 つのベクトルは直交している。そう読めると、数式が急に「仕様書」に見えてきます。
この版でできること
- 58 トピック：数と記法、ベクトルと内積・外積、行列、集合と数体系、論理、微積入門、確率・統計、そしてグラフィックスの作例まで
- 読みながら練習できる：34 トピックで入力を変えて確かめられる練習問題つき。読むだけじゃなく、手を動かして理解をチェックできます。進捗はブラウザに保存されます
読みながら練習できるカード。入力を変えて理解をチェックできます。
- Math / ML / Symbols のタブ：トピックからも記号からも引けるので、「この記号なんだっけ」で逆引きできます
- 中国語版・Python 版へのリンクもサイト内にあります
なぜ作ったか
レトロ 3D のエンジンやエミュレータを書いていると、ベクトル・行列・内積は日常の道具です。でもそれらを論文やシェーダーの記事の言葉で読めるようになるまでが遠い。数式が読めると、読める資料の量が一気に増えます。自分がほしかったのは、まさにその橋渡しでした。
なお、このインタラクティブ版は Experience-Monks の math-as-code をもとにしています（MIT ライセンス、原著作者のクレジットはサイト内に保持）。誤りを見つけたら、追加してほしいトピックがあったら、チケットや PR で教えてください。
みなさんに聞きたいこと
みなさんが数式でつまずいた記号はどれですか？ Σ、∇、∫、それとも行列の積？ 次に追加してほしいトピックがあれば、ぜひコメントで教えてください。