こんにちわ、アプリケーション基盤チームの青木(@a_o_k_i_n_g)です。好きなみかんは紅マドンナです。 今回は、サイボウズのサムネイル事情について記事を書きたいと思います。サイボウズに限らず通常の Web アプリケーションでもサムネイル作成はよくあると思いますが、ハマりどころが多く涙しているサムネイリストも多いかと思います。これからの時代を生きるサムネイリストが快適なサムネイルライフを送れるよう、知見を共有したいと思います。 弊社では画像変換ツールに ImageMagick を用いており、従って本知見は ImageMagick 固有のものがほとんどです。 画像比較は人間の眼で行うべし サムネイル周りに何か修正を入れたら修正前後の画像を比較しましょう。機械によるバイト列の比較では画像の良し悪しがわかりません。頼れるのは人間の眼だけです。肉眼で確認しましょう。 比較できるツールを作ると良
たとえば複数ページのPDFをJPGの複数ファイルに変換するときは次のようにする。 $ convert foo.pdf foo.jpg うまくいくとfoo-0.jpg, foo-1.jpg, ... というように展開される。 *1 ただこれがうまくいかないことがあって、複数ページなのに最初のページしか出力されないことがある。これはAdobe系のツールで生成されたPDFとGhostscriptが出力に使うpngalphaの相性が悪いために起こるらしく、詳しくはpossible bug converting acrobat pdf to other formatsに書いてある。 対応としては、pngalphaの代わりにpnmrawを使うようにdelegates.xmlを設定してやればよい。 homebrewで入れた場合delegates.xmlは/usr/local/opt/imagemagic
pdfをjpegに変換しようとしたらこんなエラーが出た: $ convert -limit memory 512 -density 600 -quality 80 -resize 800x /path/to/001.pdf /path/to/001.jpg **** Error reading a content stream. The page may be incomplete. **** Error reading a content stream. The page may be incomplete. Error: /typecheck in --run-- Operand stack: --dict:3/3(L)-- 13787 1 1 --nostringval-- --nostringval-- --nostringval-- 0 3 1 1 --nostringval--
はじめに ■目的 ImageMagick と PHP。 そしてPHPからImageMagickを利用するためのPHP 拡張モジュールImagick。 これらを利用することでPHPスクリプトから画像変換が出来ます。 しかし、これだけではPDFから画像変換が出来ません。 そこでGhostscriptを導入しPDFの画像変換を行ってみました。 ■Ghostscriptとは PostScript/PDF インタプリタ。 よく分かりませんが、アドビシステムズのPostScriptファイルを画像ファイルに変換することが出来るもののようです。 こちらを導入することでImageMagick+PHPでPDFより画像変換が可能となるとのこと。 ■公式サイト http://www.ghostscript.com/ ■今回の実装環境 CentOS 6.5 (64bit) php 5.4.33 httpd 2.2.
<policy domain="coder" rights="none" pattern="EPHEMERAL" /> <policy domain="coder" rights="none" pattern="URL" /> <policy domain="coder" rights="none" pattern="HTTPS" /> <policy domain="coder" rights="none" pattern="MVG" /> <policy domain="coder" rights="none" pattern="MSL" /> <policy domain="coder" rights="none" pattern="TEXT" /> <policy domain="coder" rights="none" pattern="SHOW" /> <policy doma
概要 縦横のサイズがそれぞれ 1px で、背景が透明なダミー用の画像が欲しい。 できればコマンドラインでサクッと作りたい。 余計なツールは入れたくない。 ググればすぐに答えを得られるが、備忘用にメモっておく。 結論 ImageMagick の convert コマンドを使う。
参考 http://www5a.biglobe.ne.jp/~nkgwtty/njaLinuxImageMagick.html http://hashi4.civil.tohoku.ac.jp/soft/node43.html コマンドはこんな感じ $ convert before.jpg -background "#e2ddd4" -gravity north -splice 0x10 after.jpg まとめ spliceに与える引数は、「width」x「height」 gravityは、northwest,north,northeast,west,center,east,southwest,south,southeast の値をとれる この二つのオプションの相関は下記の通り width height northwest 右 上 north 真ん中 上 northeast 右 上 w
画像サイズを基準に描画する 縦と横のサイズを指定する 文字サイズは自動的に調整されますが、余白が出来ます。 この余白を調整するには”-gravity“オプションを設定します。 convert -background white -fill blue -font aquafont.ttf -size 256x64 label:penlabo.net text2.png png画像、256×64ピクセル 横のサイズを指定する 文字サイズは自動的に調整されますが、余白が出来ます。 横のサイズのみを指定することにより、縦は自動で調整されます。 convert -background white -fill blue -font aquafont.ttf -size 256x label:penlabo.net text3.png png画像、256×47ピクセル 縦のサイズを指定する 文字サイズは
ImageMagickにて、画像中の指定位置に文字列を書き込む方法を記述する。その際、フォント名を指定する。 使用バージョン ImageMagick 6.9.1-4 Q16 コマンド例 convert -size 640x400 -depth 8 gray:circle_640x400.raw -fill #101010 +antialias -font "Meiryo-&-Meiryo-Italic-&-Meiryo-UI-&-Meiryo-UI-Italic" -gravity South -annotate +0+32 "グレーの円" -depth 8 gray:circle_640x400_text.raw 位置指定 -gravityオプションを使用する。 画像上側を北(North)、下側を南(South)、左側を西(West)、右側を東(East)として、この組み合わせで指定する
やりたかったこと こんな感じで並んでいるローグライク用のモンスター画像を ↓↓↓ こういう並びに変えたかったのですが…… これだけのキャラクターの画像をすべて手作業で処理するのはかなり大変……。 なので、スクリプトで自動化できないかと調べたところ、ImageMagickを使うのがよさげでした。 ImageMagickのインストール Mac環境なのでMacPorts経由でインストールしました。 macにImageMagickをインストール! Windows環境なら、こちらを参考にインストーラーを使うと簡単にインストールできそう。 ImageMagick インストール やり方 手順 以下の手順で画像を加工することにしました 画像を切り抜いて、1つのキャラ画像に分ける 切り抜いたキャラ画像を連結する 画像の切り抜き 画像の切り抜きには -crop オプションを使います。
Index ImageMagick Examples Preface and Index Labeling Images (techniques for labeling images) Labeling below (or above) an Image Labeling on top of the Image Itself Overlaying Images (overlaying and merging images on top of each other) Watermarking (annotating for copy protection) Watermarking with Symbols Watermarking with Text Watermarking with Images Text and Image Positioning Methods The 'Grav
動画ファイルの一部をアニメ GIF にする方法。CentOS 6.2 と ffmpeg 0.6.5, ImageMagick 6.5.4.7 で確認しています。 ffmpeg では出力のファイル形式に gif を指定することで手軽にアニメ GIF が生成できます。 $ ffmpeg -i test.mp4 -s 320x180 -an -r 15 -pix_fmt rgb24 -f gif test1.gif しかし、この方法だと、パレットが固定の256色で汚いアニメGIFになってしまいます。 ffmpeg では静止画をコマごとに切り出して、それを ImageMagick の convert コマンドで結合させるときれいに出来るということなので挑戦。 まずはコマごとに切り出し $ mkdir work $ ffmpeg -i test.mp4 -an -r 15 -s 320x180 wo
大した話ではないけれど、GIFアニメをコマンドラインから作るならGraphicsMagickが便利なので共有します。 MP4の動画ファイルからGIFアニメを作ろうとすると、まずffmpegで動画を画像に分割してそれからimagemagickでGIFに結合するという方法があります。 % ffmpeg -i hoge.mp4 -r 2 %04d.png % convert *.png hoge.gif複数枚の画像をimagemagickでGIFに結合するのが実は結構時間がかかるため煩わしいことが多いです。場合によっては、数十秒かかったりする。 ImageMagickのfork版であるGraphicsMagickを使うと高速にGIFアニメを生成することができます。 GraphicsMagickのほうが3~4倍速い GraphicsMagickを使えばImageMagickよりも3~4倍高速にGI
mp4 動画のちょっとした部分を転送するのは面倒だ 動画ってアップロードや再生でちょっと不便だったりする。 アニメーションGIFだって動きが激しいと重くなるしMP4のような最適化が効かないの・・・それは理解できるんだけど、ブログや画像アップローダーに投げるにはMP4より画像ファイルのほうが楽だったり。Mp4で送信すると「キャリアに通信の最適化」を食らいそうだしね。 アニメーションGIFを作る ffmpeg でアニメーションGIFを作るには ffmpeg -i input.mp4 -an -r 15 -pix_fmt rgb24 -f gif out.gif このようにすると一発でアニメーションGIFが作れる。 だけど、もう少し編集したいときはConvert(ImageMagick)を使う。 ffmpeg だけで作ったアニメGIFファイルが、気に入らない時は、一旦画像ファイルに切り出して、そ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く