画像サイズ変更の仕方

CGIテクニック集トップへ





概要

GDを利用し画像ファイルのサイズを取得しXYのアスペクトレシオ(Aspect Ratio)を保持したまま画像サイズを変更しブラウザ上で表示します。ファイルには書き出さないのでサムネイル作成ではありません。サムネイル作成につきましてはサムネイルの作り方を参照ください。 この手法はアルバム3メッセージボード3など当サイトで公開されている画像を表示するCGIで多数利用されています。

必用な処理

  1. 元画像ファイルからオブジェクトを作成
  2. オブジェクトから画像ファイルのサイズを取得
  3. 指定の画像サイズに収まるように縮小比を計算
  4. 新しい画像サイズで画像を表示

サンプルコード

 use GD;
 
 my $im;
 $im =~ /\.jpe?g$/i and $im = GD::Image->newFromJpeg($imagefile);
 $im =~ /\.gif$/i   and $im = GD::Image->newFromGif($imagefile);
 $im =~ /\.png$/i   and $im = GD::Image->newFromPng($imagefile);
 $im =~ /\.gd$/i    and $im = GD::Image->newFromgd($imagefile);
 $im =~ /\.gd2$/i   and $im = GD::Image->newFromgd2($imagefile);
 
 my ($width, $height) = $im->getBounds();
 
 my $width_shrink  = $max_width / $width;
 my $height_shrink = $max_height / $height;
 my $shrink_ratio;
 if ($width_shrink < $height_shrink){
        $shrink_ratio = $width_shrink;
 } else {
        $shrink_ratio = $height_shrink;
 }
 my $actual_width = int($width * $shrink_ratio);
 my $actual_height = int($height * $shrink_ratio);
 
 print qq(<img src="$image" width="$actual_width" height="$actual_height">\n);

コードの解説

 use GD;

GDを定義します。GDのさまざまなメソッドを利用します。

 my $im;
 $im =~ /\.jpe?g$/i and $im = GD::Image->newFromJpeg($imagefile);
 $im =~ /\.gif$/i   and $im = GD::Image->newFromGif($imagefile);
 $im =~ /\.png$/i   and $im = GD::Image->newFromPng($imagefile);
 $im =~ /\.gd$/i    and $im = GD::Image->newFromgd($imagefile);
 $im =~ /\.gd2$/i   and $im = GD::Image->newFromgd2($imagefile);

$imagefileには画像ファイル名が入っていると仮定します。ファイルの拡張子によりファイルタイプを認識しGD::Image->newFromxxxによりそのファイルからオブジェクトを作成します。オブジェクトは$imに格納されます。

古いバージョンのGDではnewFromGifがサポートされていません。拡張子と実際の画像タイプが違う場合はGDからエラーがでます。ファイルサイズが0などとにかくGDを騙すようなファイルの場合にはGDがエラーになります。これらのエラーはFatalでスクリプト自体が動かなくなります。サーバーのerror log等から原因を解明しエラーの原因となるファイルを修正するとよいでしょう。

 my ($width, $height) = $im->getBounds();

getBoundsメソッドにより元の画像サイズを取得します。$widthに幅、$heightに高さ情報が入ります。

 my $width_shrink  = $max_width / $width;
 my $height_shrink = $max_height / $height;
 my $shrink_ratio;
 if ($width_shrink < $height_shrink){
        $shrink_ratio = $width_shrink;
 } else {
        $shrink_ratio = $height_shrink;
 }
 my $actual_width = int($width * $shrink_ratio + 0.5);
 my $actual_height = int($height * $shrink_ratio + 0.5);

$max_widthと$max_heightに予め設定されている表示枠が入っています。幅と高さの縮尺比を出し設定枠に沿うように幅か高さの比のどちらかを選択します。その比を元の幅と高さに適用し新たな幅と高さを求めます。計算された画像サイズの端数を四捨五入するためにintする前に0.5をプラスしています。

 print qq(<img src="$imagefile" width="$actual_width" height="$actual_height">\n);

新たに求めた幅と高さのサイズで画像をブラウザ上に表示します。

関連するCGIテクニック

画像サイズの取得
Image::Sizeを使って画像サイズを取得する方法
サムネイルの作り方
画像ファイルサイズを制限したサムネイルの作り方
画像プリロードの仕方
Exif情報の取得の仕方