用 ImageMagick 製作滿版縮圖
  • 5,205 views,
  • 2013-10-21,
  • 上傳者: Kuann Hung,
  •  0
在製作網站時,如果為了美觀並且排版好看,通常都會為文章中的圖片作縮圖。
 
而縮圖的做法有簡單的,直接改掉 image tag 中的 width & height。也有複雜的產生另一張等比例縮小的圖。
 
直接改 width & height 的缺點就是圖檔大,載入時間較久,所以做等比例縮小的圖比較好。
等比例縮小的圖也是有講究的。如果只是等比例縮小,卻忽略圖片本身的長寬比的話,反而會把圖片弄變形,或是無法滿版,排版上就比較不好看。
 
所以下面要介紹我用 ImageMagick 作滿版的縮圖,基本上我的做法是:
1. 判斷圖檔的長寬,然後抓較大的那邊先對齊到縮圖的尺寸。
2. 從左上角開始把多餘尺寸外的圖都裁掉。
用說的不如看圖,以下圖來說,尺寸是 950x355
e51169ca1d3434bfaf648327f3f544db.jpg
 
而我們的目標是要做成 326x228.
步驟
1.
 950x335 縮圖成 610x228 (取較大的一邊)
2.
從左上角切出 326x228
3.
這樣的縮圖就會是滿版,而且會很好看。
至於為何抓左上角呢?其實也可以自行計算重中間抓,只是不同的策略而已。
以下就是程式碼的部分。我是用 php 呼叫外部的 convert (ImageMagick 的執行檔) 製作的。
 
// 目的地尺寸及檔案
$size = "326x228";
$output_file = "thumb.jpg";
 
list($resizeW, $resizeH) = split("x", $size);
 
// 先抓出圖片的=長寬資訊
@list($width, $height, $type, $attr) = getimagesize( $source_img );
 
// 確認是否有抓到正確的檔案
if($resizeW!=0 && $resizeH!=0)
{
 
    // 找出正確的輸出比例
    $aspect_ratio =  $resizeW / $resizeH;
    $factor = (($width/$height) > $aspect_ratio)?($width/$resizeW):($height/$resizeH);
     
    $newWidth = round($width / $factor);
    $newHeight = round($height / $factor);
     
    $offset_w = round(abs( $newWidth - $resizeW ) / 2);
    $offset_h = round(abs( $newHeight - $resizeH ) / 2);
     
    $offset_w = 0;
    $offset_h = 0;
     
    $cmd = 'convert '.$source_img.' -thumbnail '.$size.'^ -crop '.$size.'+'.$offset_w.'+'.$offset_h.' '.$output_file; 
 
    pclose(popen("$cmd ", 'r'));
}
 
以上計算方式以及處理檔案位置的部分就靠自己囉,應該並不困難啦!
希望大家都能提供好看的縮圖喔!
註:我用的版本是  ImageMagick 6.7.3-2
Facebook 討論區載入中...
資料夾 :
標籤 :
發表時間 :
2013-10-21 00:24:54
觀看數 :
5,205
發表人 :
Kuann Hung
部門 :
老洪的 IT 學習系統
QR Code :