KAGE/engine
これは何？
KAGEフォーマットで記述された漢字グリフをレンダリングするスクリプト群です。
JavaScript（ECMAScript、ActionScript）で記述されています。Adobe FlashやFlexにも組み込み可能です。
現在、レンダリングエンジンの実装はC言語（KAGE/cgiのエンジン部）および、JavaScript（KAGE/engine）の2種類があり、内容の同期が取れていません。今後はJavaScriptによる実装に一本化します。
ダウンロード
CVSリポジトリより入手してください。
% cvs -d:pserver:anonymous@cvs.m17n.org:/cvs/chise co kage/engine
使い方
sample.jsを参考にしてください。
01:load("2d.js");
02:load("buhin.js");
03:load("kage.js");
04:load("kagecd.js");
05:load("kagedf.js");
06:load("polygon.js");
07:load("polygons.js");
08:var kage = new Kage();
09:var polygons = new Polygons();
10:kage.kBuhin.push("u6f22", "99:0:0:9:12:73:200:u6c35-07$99:0:0:54:10:190:199:u26c29-07");
11:kage.kBuhin.push("u6c35-07", "2:7:8:42:12:99:23:124:35$2:7:8:20:62:75:71:97:85$2:7:8:12:123:90:151:81:188$2:2:7:63:144:109:118:188:51");
12:kage.kBuhin.push("u26c29-07", "1:0:0:18:29:187:29$1:0:0:73:10:73:48$1:0:0:132:10:132:48$1:12:13:44:59:44:87$1:2:2:44:59:163:59$1:22:23:163:59:163:87$1:2:2:44:87:163:87$1:0:0:32:116:176:116$1:0:0:21:137:190:137$7:32:7:102:59:102:123:102:176:10:190$2:7:0:105:137:126:169:181:182");
13:kage.makeGlyph(polygons, "u6f22");
14:print(polygons.generateSVG());
- 1行目から7行目で各スクリプトファイルを読み込みます（loadはMozillaプロジェクトによるJavaScript実装でのメソッドです。Adobe FlashのActionScriptの場合は、#include "ファイル名" とします）。
- 8行目でKAGEオブジェクトを用意し、9行目は生成されるポリゴン集合を受けるオブジェクトを用意します。
- 10行目から12行目で、部品バッファに 3つの部品をセットします。
- 13行目で、部品バッファ内の u6f22 という部品をグリフとしてレンダリングします。結果は polygons に格納されます。
- 14行目は、ポリゴン集合をSVG形式に変換します（printはMozillaプロジェクトによるJavaScript実装でのみ利用可能なメソッドです。Adobe FlashやHTMLで利用する場合は、直接polygons.arrayの値を用いてポリゴンを描画します。詳しくは後述します）。
コマンドライン（コマンドプロンプト）から使う
コマンドラインから利用するためにはJavaScriptエンジンが必要です。以下を想定しています。
- MozillaプロジェクトのSpiderMonkey(JavaScript-C)エンジン
- MoziilaプロジェクトのRhinoエンジン
- (Google V8 JavaScriptエンジンも利用可能です。shell.ccからの起動に成功しています)
直接JavaScriptを実行できるSpiderMonkeyは、Debian GNU/Linuxではパッケージ(spidermonkey-bin)があるのですぐに利用できます。
% js ./sample.js
Rhinoの場合、Javaが動く環境があればすぐに利用できます。まず、Rhino Downloadsから最新のバイナリをダウンロードします。中にjs.jarというファイルがあるので、それをパスが通った場所などに置きます。Windowsのコマンドプロンプトでも可能です。
% java -jar js.jar ./sample.js
HTMLおよびAdobe Flash、Flexから使う
polygonsオブジェクトのarrayプロパティに1画ごとにポリゴン情報が格納されています。ポリゴンはarrayプロパティで座標が格納されています。.xと.yで値を取り出します。sample.html（Firefox, Safariなど<canvas>が利用できるブラウザのみ）およびsample.asを参考にしてください。
例：polygons.array[2].array[1].x → 3画目の第2点のx座標
また、Flexでも利用可能と思われます。Tamarinプロジェクトのavmplusによる実行を確認しています。
fonts.jp