Bài 22: Xử lý đồ họa với thư viện GD

Thủ thuật sử dụng thư viện GD tác giả : Dan Radigan Macromedia
Cơ Bản Graphics

Chúng ta hãy bắt đầu tìm hiểu khái niệm về tệp ảnh là gì và nó đuợc diễn đạt qua máy vi tính như thế nào. Một tệp ảnh chẳng khác nào là một tập hợp của đủ thứ pixel hay dots bởi một màu sắc nhất định nào đó.
Mọi hình ảnh đều có dạng hình chử nhật (rectangular) và có cạnh dài và ngắn nhất định, đuợc tạo bởi một matrix của pixels. 100 hình mỗi hình có 300 pix sẽ có tổng số pix là 30000 pixels. Trong php, hình ảnh là một hệ thống liên hợp (coordinate). Ví dụ: x bằng 300 và y bằng 100.

Ở góc độ trên bên trái của hình nó sẽ luôn là (0,0). Giá trị của x tăng dần theo khi kéo chéo một đường từ góc trái xuống góc phải đối diện (x,y), cũng như giá trị y tăng dần khi kéo một đường thẳng từ trên xuống dưới(0,y).Khi cho mô tả chi tiết bất kỳ vào khung ảnh nó luôn liên quan tới góc độ trái phía bên trên. Nhìn example trên, góc liên hợp (180, 50) đựơc đóng lại phía tay phải của tệp hình, khoảng giữa đổ xuống.
Làm một giả sử tương tự trong đời sống, để  nhìn hình ảnh đựơc diễn tả như thế nào. ta hãy tưởng tượng bạn đặt 100 con cá màu vàng vào một ô có chiều cao là 10 và chiều dài cũng là 10, căn bản chúng ta sẽ thấy một hình vuông màu vàng. Bây giờ  bạn thử thay vào đó vài con cá khác màu xanh theo dạng hình chữ H chúng ta sẽ nhận ra ngay chữ H xanh trong một khung hình vàng. Chúc mừng bạn, bạn đã tạo một tệp ảnh động rồi đó...
Một điểm cần chú ý nữa đó là transparency (vô sắc).Transparency có khả năng tẩy „clear“ pixel. Trong trường hợp ta muốn giấu mấy con cá vàng,  bạn chỉ cần đổi chúng thành vô sắc, sau đó  bạn chỉ còn thấy chữ H màu xanh bao bọc bởi một màu trắng do transparency kết nối lại với nhau.

Image-formate
Cấu trúc, được html hiện thị lên web-site để biểu diễn hình ảnh luôn là một liên đới tĩnh (relativ statisch ). Dạng hình đã thay đổi chút ít trong những năm qua. 3 dạng hình quan trọng thường đựơc dùng là gif, jpeg, png.
GIF được viết tắc từ Graphics Interchange Format. Vài năm trước đây gif rất được sử dụng phổ biến, bởi tính năng vô sắc ( transparency ) của nó. Dạng màu của Gif được kết hợp bởi 8-bit, do đó  bạn chỉ  không phải là không có 256 màu trong một tệp ảnh duy nhất.
Do tác động của sức chứa màu, ảnh Gif chủ thích hợp với những khung có diện tích lớn.
Trong những năm gần đây Unisys Corporation, chủ quyền của LZW compression, người toàn quyền về việc sử dụng dạng hình gif, đã mất quyền chuyên giữ (patent) vào khoảng tháng 6 2003, nên giới sử dụng dạng gif cũng giảm xuống rất nhiều.

JPEG, Joint Photographic Experts Group, một dạng hình thích hợp cho ảnh chụp.Dạng jpeg không có vô sắc màu, nên nó không thích hợp với các toolbars hay Form không có góc cạnh.
PNG, Portable Network Graphics, một dạng dình mới được hổ trợ bởi đủ thứ trình duyệt. PNG có nhiều điểm lợi gần như của gif cộng cả tính vô sắc màu. Điểm cần chú ý PNG không biểu hiện rỏ ràng trên trình duyệt của netscape 4,  Thế nhưng mọi trình duy hiện tại đều diễn đạt tốt. bạn nên thử loại hình này trong mọi trình duyệt view nó có thích ứng không.
Thủ thuật biến đỏi ảnh bằng PHP
GD là một ANSI-C thư viện cho việc tạo lập hình ảnh động. Tương tự như php, thư viện gd là một mã nguồn m tại của boutell.com ta  không phải là không vào đây để tải nó xuống nếu trong php chưa có thư viện này ( tôi nghĩ rằng không, php đã cài sẳn nó rồi, cảm ơn trời phật :-))
Installation thư viện GD: chỉ nói ngắn gọn.
 view trong file php.ini. Tìm dòng ;extension=php_gd2.dll bỏ dấu „ ; „ và start apache là ok. Muốn cho chắc chắn thì vào trình duyệt gọi tệp này <?php phpìno() ; ?>  look tv GD đã bật chưa.
GD-API bao gồm rất nhiều function, giúp ta tạo, sửa các tệp tin hình ảnh qua lập trinh php.API rất bao la và không chỉ vỏn vẹn trong phần tạo ứng nhỏ trong bài này. Chúng ta tập trung vào 4 điểm quan trọng :
-Phương thức cơ bản (basic funtions)
-Sảo thuật màu (color manipulation)
-Vẽ hình (drawing primitive shapes)
-Vẽ chữ ( working with text)

the basic function
Chúng ta bắt đầu với cốt lõi của function và dùng nó để tạo hình trong bất kỳ server-graphic nào. Function này sẽ nạp (load ) hình từ máy, lưu giử vào bộ phận nhớ ( memory) sau đó ghi hình vào đĩa cứng (disk) hay chuyển (streaming) đến trình duyệt.
Creating Images
 chúng ta  không phải là không dùng function imagecreate () để tạo một nguồn ảnh mới để chỉnh đổi. Cách gọi : Ressource imagecreate (int x_size, int y_size) .
Function imagecreate() trả lại cho chúng ta nguồn (resource) tương đương với ảnh hình giống như cú pháp của mysql mysql_connect() trả cho chúng ta một mảng dử liệu ( recordset), nhưng ta  chắc chắn không sử lý trực tiếp vào biến này được, ở đây có liên quan đến funtion làm biến đổi hình ảnh,  kết luận là nó sẽ vận chuyển source của ảnh đến funtion image để làm việc này. Function sẽ cho ta kết quả của ảnh ở độ phân giải x_size và y_size.

Sử dụng ảnh đã có (Using Existing Images)
Để tạo một ảnh trống (blank image) , chúng ta không phải là không lấy ảnh từ disk qua các funtions sau:
resource imagecreatefromjpeg (string filename) // ảnh dạng jpeg
Ressource imagecreatefrompng (string filename) // ảnh dạng png
 rất nhiều tương tự như funtion imagecreate(). 2 Funtions này trả cho ta giá trị của nguồn ảnh tương đương với tệp ảnh trong disk , nếu nó là true. Nguợc lại funtion trả một chuỗi trống ( empty string) nếu là false. Nếu fopen-wrappers' được bật lên (  không phải là không chỉnh sửa trong tệp tin php.ini)  chúng ta  không phải là không dùng URL như tên của tệp ảnh.
Nhưng coi chừng máy sẽ chạy chậm đi vì phải tìm chất liệu qua HTTP. Mỗi khi 1 chức năng dùng URL thay vì một hồ sơ trên đĩa, chức năng script phải tìm qua mạng lưới. Vì qua mạng lúc nào cũng chậm hơn là đi thẳng từ đĩa nên máy chạy chậm đi là 1 quan tâm ở đây.
fopen_wrappers chạy tốt với php trên nền unix và cũng được chỉnh sửa trên nền Windows kể từ phiên bản (vers.) 4.3.

Truy tìm kích thước của tệp ảnh ( Finding an Image's Size)
Rất nhiều điểm lợi khi ứng dụng web cho ta biết kích thước của ảnh. Chúng ta không phải là không sử dụng thông tin này: giả sử cần kích thước chính xác của ảnh để làm một popup-window cho một thư viện ảnh hoặc đặt ảnh theo chiều cao, rộng trong <img>tag.
Array getimagesize ( string filename [, array imageìno])
funtion getimagesize() trả về cho ta 4 phần tử (elements) array là:
element 0: độ ngang của ảnh trỏ về tham số pixels của tệp ảnh
element 1: độ cao của ảnh trỏ về tham số pixels của tệp ảnh
element 2: trị số (interger) tương đương cho loại ảnh (typ image) (1=gif, 2=JPG, 3=PNG)
element 4: chuỗi gắn thêm (add) vào <img>tag để biểu hiện độ cao rộng, vd: „height=100 width=200“
Tham số (parameter) của tệp ảnh dự bị được chuyển đưa đến dãy array nhằm lấy thêm những thông tin của ảnh. Khi họat động nó trả lại một JPG APP (nhờ thằng google nó giải thích giùm là cái gì nhá) khác nằm trong một associative array.
Truy lùng độ phân giả cao rộng ( retrieving the width and height)
Nếu chúng ta cần đến độ cao rộng của ảnh chúng ta không cần đo thông tin ảnh trong mãng array một cách khó khăn.
Chúng ta không phải là không sử dụng funtion imagesx() và imagey() để truy tìm độ cao rộng của tệp ảnh.
Int imagex ( resource image)
Int imagey ( resource image)
Như đã thấy funtions imagex và imagey trả cho ta giá trị của độ cao và rộng của tệp ảnh. Cũng cần lưu ý function này không giống như function getimagesize trên. 2 functions này chỉ lấy nguồn ảnh (resource) , chứ không phải đường dẫn của ảnh (file path). Muốn tạo ảnh ta nên dùng funtion imagecreate() trước sau đó đến 2 function imagex() và imagey() để lấy tham số của ảnh do imagecreate() tạo.

Copy và Bóp ảnh ( copy & resizing an a image)
Chúng ta không phải là không dùng coy và resize để tạo ảnh mới. Function này rất lợi cho việc làm thư viện hình ảnh như thubmnails...
int imagecopyresized (resource dst_im, resource src_im,
int dstX, int dstY,int srcX, int srcY,
int dstW, int dstH, int srcW, int srcH)
Function này copy phần góc (rectangular) của nguồn ảnh và trao trả chúng đến đích của ảnh thật.
dst_im, src_im – the destination and source image resources
int dstX, int dstY – the upper-left corner of the replaced content in the destination image
int srcX, int srcY – the upper-left corner of the source content in the source image
int dstW, int dstH – the width and height of the rectangular area to replace in the destination image
int srcW, int srcH – the width and height of the rectangular area to copy in the source image
Nếu trong phạm vi góc thì không tương ứng với độ cao rộng trong khoảng giữa nguồn ảnh và đích ảnh. Function này họat động tương đối nó  không phải là không copy từng vùng (regions) với cùng lọai ảnh (same image) (vd: dst_im tuơng ứng với src_im ). Tuy nhiên nếu vùng ảnh(régions) nằm trên vùng đã có kết quả (results) thì ta chắc chắn không liệu trước được.
Cho ảnh hiệ thị trên trình duyệt ( outputting to the browser)
Khi đã chỉnh sửa ảnh xong, chúng ta cần tìm giải pháp cho ảnh hiện trên trình duyệt. Để làm việc này chúng ta dùng function imagepng() and imagejpeg()
int imagepng (resource image [, string filename])
int imagejpeg (resource image [, string filename])
function này xuất dữ liệu nguyên thủy (raw) của ảnh đến trinh duyệt. Nếu nguồn ảnh là một tên tệp (file name) , nó sẽ được ghi chép mọi thông tin vào tệp ảnh. Tên tệp phải nằm trong đĩa cứng (disk) và php phải có toàn quyền (chmod 777) để sao chép tin tệp. Ta cần dùng funtion header() trong trình duyệt khi muốn đưa ảnh hiện thị.
Xóa bỏ bộ nhớ ( Reclaiming used Memory)
Sau giao chuyển hình đến trinh duyệt chúng ta cần loại bỏ đi phần tồn trong bộ phận nhớ qua function : imagedestory().
int imagedestory ( resource image)

Cách sử dụng căn bản
Để dùng function này chúng ta cần tạo một thubmnail để nạp (load) hình và kéo nhỏ xuống 1/8 so với ảnh nguyên thủy , kế đến lưu vào đĩa.
PHP Code:
<?php                    
   //load the image into memory and get its properties
   $img = imagecreatefrompng("goldengate.png");
   $imgsz = getimagesize("goldengate.png");
 
   //create new image for thumbnail 1/8 the size of the original
   $thumb = imagecreate($imgsz[0]/8, $imgsz[1]/8);
 
   //shrink the original image to 1/8th its size
   imagecopyresized($thumb, $img, 0, 0, 0, 0,
$imgsz[0]/8, $imgsz[1]/8, $imgsz[0], $imgsz[1]);
 
   //write the thumbnail to disk
   imagepng($thumb, "goldengate_thumb.png");
 
   //get the image size of the thumbnail for use in the HTML below
   $thumbsz = getimagesize("goldengate_thumb.png");
 
   //free resources occupied by the images
   imagedestroy($img);
   imagedestroy($thumb);
?>
<html>
   <body>
     <img src="goldengate.png" <?php echo $imgsz[3] ?>>
     <img src="goldengate_thumb.png" <?php echo $thumbsz[3] ?>>
   </body>
______
Share on Google Plus

About Unknown

This is a short description in the author block about the author. You edit it by entering text in the "Biographical Info" field in the user admin panel.
    Blogger Comment
    Facebook Comment

0 nhận xét:

Đăng nhận xét