この記事は1年以上前の古い記事です。現状に即していない記述の場合があります。あらかじめご了承ください。

Image Magickでダミー画像を生成する

nogajun
2015/04/28

(2021/9/29追記)

フォントの指定方法が、convertが認識しているフォント名を指定する方法に変わりました。フォント名は以下のようにすると調べられます。

$ convert -list font | grep Font
 (前略)
 Font: Noto-Sans-CJK-JP
 Font: Noto-Sans-CJK-JP-Black
 Font: Noto-Sans-CJK-JP-Bold
 Font: Noto-Sans-CJK-JP-DemiLight
 Font: Noto-Sans-CJK-JP-Light
 Font: Noto-Sans-CJK-JP-Medium
 Font: Noto-Sans-CJK-JP-Thin
 (後略)

表示されたフォント名を-fontオプションに指定します。

convert -size 320x200 -background "#95a5a6" -fill "#2c3e50" -font Noto-Sans-CJK-JP-Black -pointsize 36 -gravity center label:320x200 output.png

そして、セキュリティ上の理由によりパイプで直接ImageMagickの標準入力に流し込めなくなりました。なので、teeコマンドを使って入力します。入力方法は、label:の@-と指定していた部分を"$(tee)"にします。

printf "\uf03e" | convert -size 320x200 -background "#95a5a6" -fill "#2c3e50" -font FontAwesome -pointsize 36 -gravity center label:"$(tee)" output.png

ダミー画像が必要になったけどWebサービスだと複数のサイズで枚数用意するのが面倒なので、手元で生成できないかと調べたらImage Magickのconvertであっさり生成できる事がわかったのでメモ。

参考: Text Handling -- IM v6 Examples: http://www.imagemagick.org/Usage/text/

シンプルに作成するならこれだけ。

convert -size 320x200 xc:#95a5a6 output.png

320x200の画像

文字を入れるならdrawを使ってもいいけど、テキストを入れるだけならlabelを使ったほうが楽だと思う。gravityオプションで中心に表示できるけれど、labelの前に置かないとうまく動かない。

convert -size 320x200 -background "#95a5a6" -fill "#2c3e50" -font SourceHanSans-Heavy.ttc -pointsize 36 -gravity center label:320x200 output.png

テキストを入れた場合

Font Awesomeというアイコンフォントがあるけれど、これを使うこともできる。アイコンフォントを使う場合は文字コードをprintfで出力したものをパイプでつなぐ必要がある。(もう少し簡単な方法があればいいけど)

Font Awesomeの文字コードは以下のサイトから調べられる。指定方法は、実体参照のためについてる頭の&#x;とセミコロンを外して\uの形で書いておく。

Font Awesome Cheatsheet: http://fortawesome.github.io/Font-Awesome/cheatsheet/
Font Awesome v.4.3.0 | Bootstrap Cheat Sheets: http://fontawesome.bootstrapcheatsheets.com/

printf "\uf03e" | convert -size 320x200 -background "#95a5a6" -fill "#2c3e50" -font fontawesome-webfont.ttf -pointsize 36 -gravity center label:@- output.png

アイコンフォントを使った場合

枠線をつける場合は-border 1 -bordercolor redみたいにborderオプションを使うといいけど、枠は生成した画像の外に書かれるので、合わせるときは枠線分のドットをあらかじめサイズから引いておく必要がある。

printf "\uf03e" | convert -size 318x198 -background "#95a5a6" -fill "#2c3e50" -border 1 -bordercolor "#e74c3c" -font /usr/share/fonts/truetype/font-awesome/fontawesome-webfont.ttf -pointsize 64 -gravity center label:@- output.png

枠線あり

_ tDiaryのカテゴリインデックスが生成されない理由がわかった

以前、一時期使っていたetDiaryスタイルが入ってなくて、そこでコケてた。 10年以上日記書いてたらいろいろあるけど、記法をマイグレードする手段とかないのかな。