rubyで画像処理をする場合には、RMagickが使われます。今回はその中でもウェブアプリケーションを作る上で使用頻度が高いであろう、リサイズのやり方についてご紹介します。

はじめに

本稿で紹介するすべてのサンプルコードは、事前に以下のコードを実行している前提で記述しています。また、破壊メソッドと非破壊メソッドの両方があるメソッドについては、サンプルコードでは特段の理由がない限り破壊メソッドを利用しています。

require 'rubygems'
require 'rmagick'

scale = 0.3
width = 160
height= 160

サンプル画像は以下を用います。

画像ファイルの読み込み

RMagickで画像ファイルの読み込みを行う場合は、以下のようにreadメソッドを用いて行います。

image = Magick::Image.read('original.png').first

リサイズの種類

最初に、一口にリサイズといってもRMagickには多くのメソッドが用意されています。まずは、基本的なメソッドを4つほど紹介・比較していきます。

resizeメソッド

resizeメソッドは、（⁠元画像によるところはありますが）画質もよいですがファイルサイズは大きくなりがちです。また、リサイズの計算を行うためのフィルタも指定ができ、処理内容を調整することができます。

image = Magick::Image.read('original.png').first
image.resize!(scale)
image.write('resize.png')

scaleメソッド

scaleメソッドは、resizeよりも画質がやや悪くファイルサイズはやや小さくなる傾向があります。

image = Magick::Image.read('original.png').first
image.scale!(scale)
image.write('scale.png')

thumbnailメソッド

thumbnailメソッドは、本来元画像の10％より小さい画像を作るためのメソッドで、ファイルサイズは画像のサイズにしては大きくなる傾向があります。ですが、実行速度は速くできます。

image = Magick::Image.read('original.png').first
image.thumbnail!(scale)
image.write('thumbnail.png')

sampleメソッド

sampleメソッドは、通常リサイズの場合に発生する中間色を一切作らないため、実行速度は速くファイルサイズも小さくできますがこの中で一番画質を犠牲にしています。

なお、すべてのメソッドで scale の代わりに width, height を引数として渡すこことができます。

image = Magick::Image.read('original.png').first
image.sample!(scale)
image.write('sample.png')

以上、駆け足で紹介しましたが、4つのメソッドのどれが一番優れているというのはないため、状況によって使い分けていく必要があります。ただ最初はresizeを使うようにして、必要に応じて他のメソッドに変えていくのがよいでしょう。

指定縦横サイズに収めるリサイズ

次に、若干特殊なリサイズといいますか、実際にウェブサイトを作る上で使われやすい、縦横サイズを指定してその範囲に収まる画像を作る方法について説明します。

単純に縦横指定でリサイズする

手始めにresizeメソッドにそのまま指定サイズを放り込んだ場合は、以下のようになります。

image = Magick::Image.read('original.png').first
image.resize!(width,height)
image.write('just_resize.png')

目的はぎりぎり満たしたと言えなくもないですが、指定サイズと元画像サイズの縦横比が異なるため画像が歪んでしまっています。

ほとんどの場合、これではOKが出ないと思いますので、画像を歪ませない方法を続いて紹介していきます。

縦横比固定でリサイズする

rmagickにはresize_to_fitという便利なメソッドがあるのでこれを使います。上の例との違いは利用するメソッドを変えただけですが、これだけで元画像の縦横比を維持したまま指定サイズに収まる画像を得るという目的を果たすことができます。

image = Magick::Image.read('original.png').first
image.resize_to_fit!(width,height)
image.write('resize_to_fit.png')

縦横比を固定しているため、指定サイズぴったりにはなっていませんが、これを問題としないシステムも多いかと思います。

もちろん問題となるケースもありますので続いて、縦横比を維持しつつ指定サイズぴったりにする方法を何種類か紹介したいと思います。

画像の一部を切り抜く

画像の一部を切り抜く場合にはcropメソッドを利用します。このメソッドは、リサイズはせずに画像の一部だけを取り出しているため、目的によってはこのほうが望ましいこともあるのではないでしょうか。

image = Magick::Image.read('original.png').first
image.crop!(Magick::CenterGravity,width,height)
image.write('crop.png')

どの部分を切り抜くかは第1引数で指定し、たとえば左上で切り抜きたい場合はNorthWestGravityを指定します（サンプルは画像中央を切り抜いています⁠）⁠。また、引数の指定の仕方によってはどのピクセルから切り抜くかを直接指定することもできます。

リサイズしつつ画像の一部を切り抜く

リサイズしつつ画像の一部を切り抜く、ということで、resizeメソッドとcropメソッドを両方使えばよいわけですが、自分でそのコードを記述しなくても、一括して処理してくれるresize_to_fillメソッドがあります。

image = Magick::Image.read('original.png').first
image.resize_to_fill!(width,height)
image.write('resize_to_fill.png')

このメソッドは元画像の縦横と指定縦横サイズを比較して、縦と横のうち比率が小さいほう（今回のサンプルだと、縦450/160=2.8125、横600/160=3.75なので、縦）が指定サイズに合うようにリサイズし、もう一方向を切り抜きます。つまり、左右または上下のどちらかだけが切り落とされることになります。

このとき切り抜く位置は第3引数で指定可能で、デフォルトはCenterGravity（中央切り抜き）です。cropメソッドと引数の順番が違うので気をつけてください。

なお、切り抜き開始ピクセルを指定することができないため、そのような場合は自力でやる必要があります。

リサイズ後足りない部分を継ぎ足す

最後に、リサイズ後足りない部分を継ぎ足す例を通して、change_geometryメソッドを用いる少し複雑な例を紹介します。

image = Magick::Image.read('original.png').first
image = image.change_geometry("#{width}x#{height}") do |cols,rows,img|
  img.resize!(cols,rows)
  img.background_color = 'black'
  img.extent(width,height,(width-cols)/2,(height-rows)/2)
end
image.write('resize_extent.png')

まずはchange_geometryというメソッドを使います。このメソッドは引数として渡した条件（サンプルコードではここまでやってきたのと同じ指定サイズに収まるという条件）を満たす縦横サイズを計算して、その値を元にblockを処理するというものです。
計算結果はblockの引数として渡されます。ちなみに、第3引数はchange_geometryを呼ばれた画像そのものです。
今回はこの計算結果（cols,rows）を元に普通にresizeを行い（ここまでだとresize_to_fitと同じです⁠）⁠、次にextentメソッドを使って継ぎ足しを行います。extentメソッドではgravityによる位置指定はできないため、自分で画像が中央に来るように計算して値を指定しています。また、背景色で継ぎ足しますので事前にbackground_colorを指定しています。ここではサンプル画像のわかりやすさから'black'を指定していますが、'transparent'または'none'を指定すれば透明色を足すことができます（もちろん、画像形式が透明色を許していればですが⁠）⁠。

change_geometryメソッドはリサイズするために必要な計算を行ってくれ、実際のリサイズ方法を自分で決められるため、複雑なリサイズを行いたい場合には非常に便利です。

なお、細かい部分ですがchange_geometryの戻り値はblockの戻り値になります。そのためサンプルコードではextentメソッドの戻り値になるのですが、extentには破壊メソッドがありませんので戻り値をimageに上書きするということをしています。

まとめ

今回は、RMagickを用いた画像処理の中で、リサイズに焦点をあて紹介しました。次回は、RMagickのクラスのひとつであるImageListの使い方やそれを用いたアニメGIFの処理方法について紹介したいと思います。