PHP極其強大的圖片處理庫Grafika詳細教程（4）：圖形繪製

該文章是接着上一篇文章：《PHP極其強大的圖片處理庫Grafika詳細教程（3）：圖像屬性處理》，是grafika教程的一個部分。

全部的教程目錄

《一、圖像基本處理》
《二、圖像特效處理模塊》
《三、圖像屬性處理》
《四、圖形繪製》

話很少說，咱們接着上實例，要看基礎描述，和下載信息請看第一篇

一、繪製貝塞爾曲線

貝塞爾曲線繪製，須要兩個端點，一頭一尾，還有兩個控制點，在之間。因此，必然最起碼4個參數。加上一個顏色共計5個參數。

從作到右，咱們依次解釋

• 第一個（數組）：表示起始點，數組內第一個參數爲x，第二個參數爲y（下同）

• 第二個（數組）：控制點1（接近起始點），數組內參數同上

• 第三個（數組）：控制點2（接近結束點），數組內參數同上

• 第四個（數組）：結束點，數組內參數同上

• 第五個：顏色，能夠用十六進制表示，好比：#ff0000

繪製貝塞爾曲線有兩個方法。可是大致步驟相同。1:、打開圖片；二、繪圖；三、保存或者輸出

一、自行選擇庫，這種方法須要自行判斷

命名空間中的use也須要注意，比以前多了兩個

use Grafika\Grafika;
use Grafika\Gd\DrawingObject\CubicBezier as GdCubicBezier;
use Grafika\Imagick\DrawingObject\CubicBezier as ImagickCubicBezier;

$editor = Grafika::createEditor();
$editor->open($image , 'yanying-smaller.jpg');
$editorName = Grafika::detectAvailableEditor();
if('Imagick'===$editorName){
    $drawingObject = new ImagickCubicBezier(array(42, 180), array(230, 190), array(42, 45), array(300, 43), '#ff0000');
} else if ('Gd'===$editorName) {
    $drawingObject = new GdCubicBezier(array(42, 180), array(230, 190), array(42, 45), array(300, 43), '#ff0000');
}
$editor->draw( $image, $drawingObject );
$editor->save($image,'333/yanying-CubicBezier-1.jpg');

二、可讓grafika本身去選擇當前適合的類

這種方法就是簡單了許多，咱們此次從新設定了參數，而且把線條顏色改成了黑色

use Grafika\Grafika;
$editor = Grafika::createEditor();
$editor->open($image , 'yanying-smaller.jpg');
$drawingObject = Grafika::createDrawingObject('CubicBezier', array(42, 230), array(230, 237), array(42, 45), array(230, 43), '#000000');
$editor->draw( $image, $drawingObject );
$editor->save($image,'333/yanying-CubicBezier-1.jpg');

效果不錯，之後再搞驗證碼就簡單多了

二、繪製橢圓

橢圓雖然看着難，可是隻要搞清楚肯定一個橢圓的幾個基本參數就能夠了。

這裏使用Ellipse參數來繪製橢圓。

後面跟着一些繪製橢圓的形狀、樣式參數。咱們從左到右描述

• 橢圓的寬：px爲單位

• 橢圓的高：px爲單位

• 位置（數組）：數組內第一個值爲x（橢圓最左邊距離圖像最左邊值），第二個值爲y（橢圓最上邊距離圖形最上邊值）

• 邊框寬度：單位px，若是設置爲0，則表示無邊框，默認爲1px

• 橢圓邊框顏色：該值須要藉助於color類，而不是簡單的填入一個顏色字符串

• 橢圓的填充值：該顏色同上

咱們建立一個200*100，距離左邊50，上邊75，邊框爲1，邊框色爲黑色，填充紅色的橢圓。

use Grafika\Grafika;
use Grafika\Color;
$editor = Grafika::createEditor();
$editor->open($image , 'yanying-smaller.jpg');
$drawingObject = Grafika::createDrawingObject('Ellipse', 200, 100, array(50, 75), 1, new Color('#000000'), new Color('#FF0000'));
$editor->draw( $image, $drawingObject );
$editor->save($image,'333/yanying-Ellipse.jpg');

查看結果

三、繪製直線

繪製直線就稍微簡單點兒了。

• 第一個參數爲數組，表示起始座標

• 第二個參數爲數組，表示結束座標

• 第三個參數爲垂直方向的順序，表示哪根線在上哪根線在下。（其中GD庫會忽略掉，默認爲1）

• 第四個參數爲顏色，不填默認爲黑色

咱們試着畫幾根線試試：

use Grafika\Grafika;
use Grafika\Color;
$editor = Grafika::createEditor();
$editor->open($image , 'yanying-smaller.jpg');
$editor->draw($image, Grafika::createDrawingObject('Line', array(0, 0), array(200, 200), 1, new Color('#FF0000')));
$editor->draw($image, Grafika::createDrawingObject('Line', array(0, 200), array(200, 0), 1, new Color('#00FF00')));
$editor->draw($image, Grafika::createDrawingObject('Line', array(0, 0), array(200, 100), 1, new Color('#0000FF')));
$editor->draw($image, Grafika::createDrawingObject('Line', array(0, 100), array(200, 100)));
$editor->draw($image, Grafika::createDrawingObject('Line', array(100, 0), array(100, 200)));
$editor->save($image,'333/Line.jpg');

四、繪製多邊形

咱們使用Polygon繪製多邊形，其中參數爲

• 第一個參數爲座標點，是一個數組，其中該數組內有3個數組，每一個數組有兩個值，第一個值表示x，第二個值表示y

形如

array(array(0,0), array(50,0), array(0,50))

• 第二個參數爲邊框寬度，0爲沒有，從1開始，單位爲px（默認爲1）

• 第三個參數爲邊框顏色（默認爲黑色）

• 第四個參數爲填充色（默認白色）

咱們試着畫幾個圖形

use Grafika\Grafika;
use Grafika\Color;
$editor = Grafika::createEditor();
$editor->open($image , 'yanying-smaller.jpg');
$editor->draw( $image, Grafika::createDrawingObject('Polygon', array(array(0,0), array(50,0), array(0,50)), 1));
$editor->draw( $image, Grafika::createDrawingObject('Polygon', array(array(200-1,0), array(150-1,0), array(200-1,50)), 1));
$editor->draw( $image, Grafika::createDrawingObject('Polygon', array(array(100,0), array(140,50), array(100,100), array(60,50)), 1, null, new Color('#FF0000')));
$editor->save($image,'333/Polygon.jpg');

五、二次貝塞爾曲線

又稱貝茲曲線或貝濟埃曲線，是應用於二維圖形應用程序的數學曲線

其形如這個樣子

咱們使用以下代碼就能夠很輕鬆的建立

use Grafika\Grafika;
$editor = Grafika::createEditor();
$editor->open($image , 'yanying-smaller.jpg');
$drawingObject = Grafika::createDrawingObject('QuadraticBezier', array(70, 250), array(20, 110), array(220, 60), '#FF0000');
$editor->draw( $image, $drawingObject );
$editor->save($image,'333/yanying-QuadraticBezier.jpg');

其中參數以下

• 第一個參數爲起始點的座標，是一個數組array(x,y)

• 第二個參數爲控制點的座標，也是數組，數組內分別爲x，y

• 第三個參數爲結束點的座標，也是一個數組，數組內爲x，y

• 最後一個參數爲顏色，默認爲黑色

固然你也可使用另一種方式來建立二次貝塞曲線

use Grafika\Grafika;
use Grafika\Gd\DrawingObject\QuadraticBezier as GdQuadraticBezier;
use Grafika\Imagick\DrawingObject\QuadraticBezier as ImagickQuadraticBezier;
$editorName = Grafika::detectAvailableEditor();
$editor = Grafika::createEditor();
$editor->open($image , 'yanying-smaller.jpg');
if('Imagick'===$editorName){
    $drawingObject = new ImagickQuadraticBezier(array(70, 250), array(20, 110), array(220, 60), '#FF0000');
} else if ('Gd'===$editorName) {
    $drawingObject = new GdQuadraticBezier(array(70, 250), array(20, 110), array(220, 60), '#FF0000');
}
$editor->draw( $image, $drawingObject );
$editor->save($image,'333/yanying-QuadraticBezier-1.jpg');

六、建立矩形

矩形，其實和橢圓形差很少，只是有個別參數有些差別。

可使用以下的代碼直接建立一個矩形

use Grafika\Grafika;
use Grafika\Color;
$editorName = Grafika::detectAvailableEditor();
$editor = Grafika::createEditor();
$editor->open($image , 'yanying-smaller.jpg');
$editor->draw( $image, Grafika::createDrawingObject('Rectangle', 85, 50)); // A 85x50 no filled rectangle with a black 1px border on location 0,0.
$editor->draw( $image, Grafika::createDrawingObject('Rectangle', 85, 50, array(105, 10), 0, null, new Color('#FF0000'))); // A 85x50 red rectangle with no border.
$editor->draw( $image, Grafika::createDrawingObject('Rectangle', 85, 50, array(105, 70), 0, null, new Color('#00FF00'))); // A 85x50 green rectangle with no border.
$editor->draw( $image, Grafika::createDrawingObject('Rectangle', 85, 50, array(0, 60), 1, '#000000', null)); // No fill rectangle
$editor->save($image,'333/yanying-Rectangle.jpg');

其中的參數

• 第一個爲：寬度。px爲單位

• 第二個爲高度，px爲單位

• 第三個爲一個數組，內包含兩個值，x：表示矩形左邊距離圖片左邊的距離；y：表示矩形的上邊距離圖片的上邊距離。默認爲array(0,0)表示和左上角重疊。

• 第四個參數爲邊框的寬度，默認爲1，當設置爲0的時候，表示沒有邊框

• 第五個參數爲邊框的顏色，默認爲黑色，當設置爲null的時候表示沒有顏色

• 第六個參數爲填充顏色，默認爲白色，當設置爲null的時候表示沒有顏色

咱們繪製了幾個矩形

---

嚴穎，PHP研發工程師

博客：segmentfault主頁