PHPでGDライブラリを使ってサムネイル画像を作ってみた

今日は、PHPでGDライブラリを使って画像を縮小、サムネイル化してみました。

数年前にうさちゃんねる掲示板で投稿された画像をまとめて表示するというコンテンツを作成していたんですが、coresreverからsixcoreへ移転した時からか、動かなくなったまま放置していたコンテンツを復活させました。

スマホ、PCのみならそのままでも表示できるんですが、ガラケ―ユーザーさんから画像が投稿されたスレッドに入れない!と報告がありました。
ガラケ―だとスクリプト側で縮小してあげないとそのままHTMLやCSSで縮小表示していると見れないみたいです。

そこでこういった画像コンテンツを作る場合、スクリプト側で縮小しなければならなくなりました;あと、スマホユーザーさんも無駄に容量を食わなくて済み読み込みも早くなるといいことづくめです。

 

 

jpg、png、gifにも対応してサイズ、画像タイプは配列で取得しました。

 

縮小するためのコード

<?php
//WebブラウザへJPEGで出力
header('Content-type: image/jpeg');

$url = ”画像URL”;


list($width, $height, $type, $attr) = getimagesize("$url");

if($type == IMAGETYPE_GIF or $type == IMAGETYPE_JPEG or $type == IMAGETYPE_PNG){

//サイズによって圧縮率を変える

if($width > 1500 or $height > 1500){
$size = "5";
}elseif($width > 1000 or $height > 1000){
$size = "4";
}elseif($width > 500 or $height > 500){
$size = "3";
}else{
$size = "2";
}


switch($type) {
case IMAGETYPE_JPEG:
$img = imagecreatefromjpeg($url);
break;
case IMAGETYPE_PNG:
$img = imagecreatefrompng($url);
break;
case IMAGETYPE_GIF:
$img = imagecreatefromgif($url);
break;
}

$out = ImageCreateTrueColor($width/$size, $height/$size);
ImageCopyResampled($out, $img,0,0,0,0, $width/$size, $height/$size, $width, $height);

//jpgで出力
ImageJPEG($out);


// メモリを開放する
imagedestroy($out);
imagedestroy($img);

}

?>

 

list($width, $height, $type, $attr) = getimagesize(“$url”);

で取得した$typeですが、今回は3つしか使わなかったものの以下のように様々な返り値があります。

左の文字列と、右の数字が返ってきます。

 

IMAGETYPE定数

IMAGETYPE定数を紹介します。

IMAGETYPE_GIF1
IMAGETYPE_JPEG2
IMAGETYPE_PNG3
IMAGETYPE_SWF4
IMAGETYPE_PSD5
IMAGETYPE_BMP6
IMAGETYPE_TIFF_II7
IMAGETYPE_TIFF_MM8
IMAGETYPE_JPC9
IMAGETYPE_JP210
IMAGETYPE_JPX11
IMAGETYPE_JB212
IMAGETYPE_SWC13
IMAGETYPE_IFF14
IMAGETYPE_WBMP15
IMAGETYPE_JPEG20009
IMAGETYPE_XBM16

 

このように、表示に困らない程度ザクッと縮小して

表示する際にはCSSを使って幅300ぐらいのサムネイルに統一して高さはautoとしておけば、さまざまな画像形式をそこそこ無劣化で表示することができました。

画像はこのブログではモザイク付きですw載せたくないので、直接見てくださいw

 

 

うさちゃんねる画像まとめ

 

まとめ

今回は縮小だけでしたが、GDライブラリには他にも様々な関数が用意されていました。
是非、皆さんもやってみてはいかがでしょうか

 

PHP: GD および Image 関数 - Manual

コメント

タイトルとURLをコピーしました