摘要：指定字體和顏色創建一個底圖創建一個白色的底圖，我們可以在上面繪制文字創建一個底圖并且加上一些文字要生成的圖片的路徑可以在服務器端看到這里需要注意一下文字的繪制命令順序，否則會出現沒有生效的問題。

[原文鏈接]https://duanruilong.github.io...://duanruilong.github.io/blog/2018/09/18/%E5%9C%A8PHP%E9%87%8C%E5%BE%88%E5%A5%BD%E7%9A%84%E4%BD%BF%E7%94%A8ImageMagick-convert%E7%AF%87/)

ImageMagick 包括一組命令行工具來操作圖片，之前的ImageMagick實現base64圖片的邏輯在服務器端可能會造成溢出的事故，所以在接下的文章里會介紹另外一種好的實現方式就是----convert命令。使用命令格式的形式去生成圖片和大小的裁剪數據格式的轉換。

magick: 創建、編輯圖像，轉換圖像格式，以及調整圖像大小、模糊、裁切、除去雜點、抖動 ( dither )、繪圖、翻轉、合并、重新采樣等。

convert: 等同于 magick 命令。

identify: 輸出一個或多個圖像文件的格式和特征信息，如分辨率、大小、尺寸、色彩空間等。

mogrify: 與 magick 功能一樣，不過不需要指定輸出文件，自動覆蓋原始圖像文件。

composite: 將一個圖片或多個圖片組合成新圖片。

montage: 組合多個獨立的圖像來創建合成圖像。每個圖像都可以用邊框，透明度等特性進行裝飾。

compare: 從數學和視覺角度比較源圖像與重建圖像之間的差異。

display: 在任何 X server 上顯示一個圖像或圖像序列。

animate: 在任何 X server 上顯示圖像序列。

import: 保存 X server 上的任何可見窗口并把它作為圖像文件輸出。可以捕捉單個窗口，整個屏幕或屏幕的任意矩形部分。

conjure: 解釋并執行 MSL ( Magick Scripting Language ) 寫的腳本。

stream: 一個輕量級工具，用于將圖像或部分圖像的一個或多個像素組件流式傳輸到存儲設備。在處理大圖像或原始像素組件時很有用。

基本命令的使用，遵循 Unix 風格的標準格式，例如 command [options] input_image output_image

將一張寬高 300x300 的圖片 goods.png 轉換成 200x200 的goods.jpg，可以這樣用

convert -resize 200x200 goods.png goods.jpg

$item_img="https://img.alicdn.com/bao/uploaded/i1/1750208593/TB1rgM3hhtnkeRjSZSgXXXAuXXa_!!0-item_pic.jpg";
$item_title="測試字體";
$shop_title="測試店鋪";
$shop_img="http://q.aiyongbao.com/item/web/images/qap_img/mobile/userAvatar.png";
$qr_img="https://img.alicdn.com/tfscom/TB1uJDStYZnBKNjSZFKwu3GOVXa.png";
$numid_share="0000000";
$qr_title="長按識別二維碼";

// 對寶貝標題裁剪
$drawtitone=mb_substr($item_title,0,13, "utf-8");
$drawtittow=mb_substr($item_title,13,13, "utf-8");
$drawtitthree=mb_substr($item_title,26,13, "utf-8");
$time_date = time(); // 時間戳
$workDir = "/data/tmp/".$numid_share."_con".$time_date; // 目標路徑---->指定一個文件夾保存生成圖片過程里的圖片

我們這里需要一個拼接圖片的鏈接，所以先下載到之前的創建的文件夾下，因為這些素材圖片只是為了最后的拼接，最后可以完全刪除。

$item_img_down = $workDir."/itemimage.jpg";
$shop_img_down = $workDir."/shopimage.jpg";
$qr_img_down = $workDir."/qrimage.jpg";
// 下載寶貝主圖
NetworkUtils::curlDownload($item_img, $item_img_down);
// 下載店鋪圖片
NetworkUtils::curlDownload($shop_img, $shop_img_down);
// 下載二維碼
NetworkUtils::curlDownload($qr_img, $qr_img_down);

NetworkUtils::curlDownload($item_img, $item_img_down); 下載$item_img保存在目標路徑文件夾下的$workDir."/itemimage.jpg"路徑。

$fontFamily = "/usr/share/fonts/chinese/msyh.ttf";
$fontColor = "#333333";
$fontColor_shoptitle = "#999999";
$fontColor_qrtitlt = "#666666";

創建一個750x1046白色的底圖，我們可以在上面繪制文字

// 創建一個底圖(并且加上一些文字)

$back_img=$workDir."/bg.jpg"; //要生成的圖片的路徑---->可以在服務器端看到
$back_cmds="convert "xc:[750x1046!]" -background white -font {$fontFamily} -draw "text 580,994 "{$qr_title}"" -fill "{$fontColor_qrtitlt}" 
            -pointsize 20 -draw "text 114,990 "{$shop_title}"" -font {$fontFamily} -pointsize 22 -fill "#999999" {$workDir}/bg.jpg";
$result_back_cmds = SystemCommon::runningCmd($back_cmds);  

這里需要注意一下文字的繪制命令順序，否則會出現沒有生效的問題。
-font {$fontFamily} -draw "text 580,994 "{$qr_title}"" -fill "{$fontColor_qrtitlt}" -pointsize 20

解釋一下：

xc:[100x40!]: 設置畫布大小的一種簡寫方式，方括號里寫入畫布寬高，注意要加 !

-fill "rgba(0, 0, 0, 0)"：設置了文本的填充顏色

text 114,990: 對文字進行定位

-font：指定字體

-pointsize：指定文本的字體大小

-draw：繪圖選項，text 聲明繪制文本， 0,0 聲明文本距離圖片左上角的偏移值，繪制文本的格式為 text x,y string，當然還可以繪制其他類型，諸如圓 ( circle )、折線 ( polyline )

繼續添加文字：

$back_img_shoptitle=$workDir."/btitle.jpg"; //要生成的圖片的路徑
$back_cmds_shoptitle="convert -draw "text 40,820 "{$drawtitone}"" -font {$fontFamily} -pointsize 32 -fill "{$fontColor}" -draw "text 40,866 "{$drawtittow}"" 
                    -font {$fontFamily} -pointsize 32 -fill "{$fontColor}" -draw "text 40,912 "{$drawtitthree}"" -font {$fontFamily} -pointsize 32 -fill "{$fontColor}"  
                    {$back_img} {$workDir}/btitle.jpg";
$result_back_cmds_shoptitle = SystemCommon::runningCmd($back_cmds_shoptitle);  

效果：
（白色的背景可能顯示不是很好）

現在就可以在之前得到的圖片上拼接所需要的圖片了

 // 在底圖上合并商品主圖
$back_img_itemimg="/data/tmp/" . md5(microtime(true)).".jpg";  //要生成的圖片的路徑
$geometryX = "+" . 0; // 定位
$geometryY = "+" . 0; // 定位
$customPicPos = "northwest";
$back_cmds_itemimg = "convert {$back_img_shoptitle} {$workDir}/item_img_mag.jpg -gravity {$customPicPos} -geometry {$geometryX}{$geometryY} 
                    -compose over -composite -antialias -set colorspace sRGB -colorspace sRGB {$workDir}/result.jpg";
$result_back_cmds_itemimg = SystemCommon::runningCmd($back_cmds_itemimg); 

解釋一下：

-geometry: 設置文本在圖片里的排列方式 ( 類似 CSS 里的 align-items + justify-content )，center 表示水平垂直都居中，其他值還可以是：NorthWest, North, NorthEast, West, East, SouthWest, South, SouthEast，不記大小寫

composite: 將一個圖片或多個圖片組合成新圖片。

這里是把{$workDir}/item_img_mag.jpg路徑的圖片繪制到之前繪制文字的圖片上$back_img_shoptitle，最終得到的圖片保存路徑是在{$workDir}/result.jpg

讓我們繼續操作圖片

// 合并二維碼 
$geometryXshop = "+" . 40;
$geometryYshop = "+" . 950;
$back_cmds_shopimg = "convert {$workDir}/result.jpg {$workDir}/shop_img_mag.jpg -gravity {$customPicPos} -geometry {$geometryXshop}{$geometryYshop} -compose over -composite -antialias -set colorspace sRGB -colorspace sRGB {$workDir}/result1.jpg";
$result_back_cmds_shopimg = SystemCommon::runningCmd($back_cmds_shopimg);  

// 合并店鋪圖標
$geometryXqr = "+" . 520;
$geometryYqr = "+" . 784;
$back_cmds_qrimg = "convert {$workDir}/result1.jpg {$workDir}/qr_img_mag.jpg -gravity {$customPicPos} -geometry {$geometryXqr}{$geometryYqr} -compose over -composite -antialias -set colorspace sRGB -colorspace sRGB {$workDir}/result2.jpg";
$result_back_cmds_qrimg = SystemCommon::runningCmd($back_cmds_qrimg);  

效果：

發現圖片并不是我們預期的效果，拼接我們也設置了圖片的大小，但是沒有起作用，嘗試過不同的方案后決定在拼接之前把圖片統一放大為需要拼接的尺寸來操作。

需要對多拼接的圖片都進行操作

 // 看來需要先放大主圖
$item_img_m="convert -resize "750x766!" {$item_img_down} {$workDir}/item_img_mag.jpg";
$item_img_mag = SystemCommon::runningCmd($item_img_m);  
// 看來需要先放大二維碼
$shop_img_m="convert -resize 64x64 {$shop_img_down} {$workDir}/shop_img_mag.jpg";
$shop_img_mag = SystemCommon::runningCmd($shop_img_m);  
// 看來需要先放大店鋪圖標
$qr_img_m="convert -resize 200x200 {$qr_img_down} {$workDir}/qr_img_mag.jpg";
$qr_img_mag = SystemCommon::runningCmd($qr_img_m);  

-resize 延伸解讀

IamgeMagick 提供了幾種符號來定義縮放

convert -resize "150x100!" goods.jpg thumbnail.jpg

convert -resize "150x100>" goods.jpg thumbnail.jpg

convert -resize "150x100<" goods.jpg thumbnail.jpg

!：不管圖片寬高如何，都縮放成 150x100 這樣的尺寸。

>：只有寬高均大于 150x100 的圖片才縮放成該尺寸 ( 按比例取最大值 )，小于的圖片不做處理。

<：與 > 功能相反

縮放對比

這樣的結果也不是我們需要的

只有convert -resize "750x766!" {$item_img_down} {$workDir}/item_img_mag.jpg這樣固定尺寸之后可以得到：

我們最后同樣的以base64格式輸出給前端

$stdout = trim($result_back_cmds_qrimg["stdout"]);
$Return = array();
if (empty($stdout) || strpos($result_back_cmds_qrimg["stderr"], "identify") != false) {  // runningCmd執行成功
    $dest_img = $workDir."/result2.jpg";
    // /*圖片轉換為 base64格式編碼*/
    $base64_image = "";
    $image_info = getimagesize($dest_img);
    $image_data = fread(fopen($dest_img, "r"), filesize($dest_img));
    $base64_image = "data:" . $image_info["mime"] . ";base64," . chunk_split(base64_encode($image_data));

    $Return["data"]=$base64_image;
    $Return["dest_img"]=$dest_img;
    $Return["type"]="success";
    $Return["msg"]=1;
    return $Return;
}
$Return["data"]="";
$Return["msg"]=2;
return $Return;

$workDir."/result2.jpg是我們最終的拼接圖片，至于文件夾下的其他圖片，可以選擇刪除。我們只要得到結果就好了。

（小姐姐拼接圖）

這次convert命令的介紹是以解讀整個方法的形式，對拼接的開始進行到結尾生成最終的圖片，希望對大家有力所能及的幫助。

歡迎光顧個人博客Blog