svg2sfd


※上記の広告は60日以上更新のないWIKIに表示されています。更新することで広告が下部へ移動します。

はじめに

InkscapeとFontforgeを使ってフォント(TTFなど)を作ります。

使用するもの

書いてあるVer.などはこちらで導入した環境。

変換スクリプトのインストール

  1. サイトからZIPでダウンロード。展開。
  2. サイトに書いてある通り、コマンドプロンプト(DOS窓)でインストール。
  • npm install -g svg2sfd

    いろいろ必要なパッケージがあれば自動的に取得するらしい。

  1. インストール後、nodeとか打って「コマンドが見つからない」以外のエラーが出ればOK。

変換元SVGデータの作成

サンプルとして置いてあるsvgファイルをベースにするのがいいかもしれない。

ドキュメント設定

  • ページ カスタムサイズ(16384x10240 px)
  • グリッド 128x128 px、メイングリッド8ごと

文字はメイングリッドのマスごとに1文字デザインし、パスのidで割り当てる文字コードを指定する。

もしすでにあるフォントを参照しながら文字コードを設定する場合、
Fontforgeの「表示」→「グリフへのラベル付け」→「Unicodeによる」を選ぶと作業しやすい。
Inkscapeのキャンバスから、グルーピングした1文字ずつ選択し、XMLエディタでidを選択、文字コード入力、Ctrl+Enter。
文字コードは16進数4桁。たぶん大小文字は関係ない。

その他

svgファイルをテキストで開くかXMLエディタで要素を追加していく。

  • ルートにあるsvgノード(id="svg2")に以下の属性を追加
    • sfdSplineFontDB="3.0"
    • sfdEncoding="ISO8859-1"
    • sfdPadding="50"
    • sfdDescent="256"
  • svg(id=svg2)→sodipodi:namedview(id=base)→inkscape:grid のidを変更
    • id="grid**"→id="glyph"
  • パスがぶらさがっているinkscape:g要素を開く
    • gタグの開きと閉じのタグ行を削除。<path **>がルートの<svg>にぶら下がるように修正する

変換

  • コマンドプロンプト(DOS窓)でパスを渡す。
    • svg2sfd input.svg

変換成功とか出ないのでわかりにくい…

Fontforgeでフォントファイル化

まだ試していないのでまだ勘。

  1. 出力されたsfdファイルをFontforgeで開く
  2. エンコーディングやフォント名、ファミリ名など設定してTFFなどご所望の形式で出力
ツールボックス

下から選んでください:

新しいページを作成する
ヘルプ / FAQ もご覧ください。