Freehand Font Editor(JavaScript手書きフォントエディタ)

要canvas要素対応ブラウザ。Mozilla Firefox 2.0以上推奨。

character:
canvas要素に対応したブラウザが必要です。 canvas要素に対応したブラウザが必要です。

使い方

  1. characterの欄に一文字入力します(例:A)。
  2. 1で入力した文字の字形を左の枠内にマウスで描きます。間違った場合はundo strokeやclear strokesで消せます。
  3. 正しく入力できたらregister glyphで字形を登録します。
  4. 必要なだけ1から3を繰り返します。
  5. output textをクリックすると字形データが表示されます。字形データは文字とストローク群の連想配列です。ストロークは[x0,y0,x1,y1,...,xn,yn]の形式で表されます。各座標は枠の左上が(0,0)で右下が(256,256)となる座標系上の点です。

作成したデータの使用例: DrawText.js

ソースコード

github