說說PHP作圖(一)
發(fā)表時間:2023-08-22 來源:明輝站整理相關(guān)軟件相關(guān)文章人氣:
[摘要]實在不敢說是在這里“講”GD庫,因為我用GD也才一兩次而已,絕大多數(shù)的函數(shù)還沒有接觸到?墒侨咧裥〉鬅崆榈叵蛭壹s稿,我只好硬著頭皮寫一點自己的心得。希望能夠起到拋磚引玉的效果。其實,我們在web頁...
實在不敢說是在這里“講”GD庫,因為我用GD也才一兩次而已,絕大多數(shù)的函數(shù)還沒
有接觸到?墒侨咧裥〉鬅崆榈叵蛭壹s稿,我只好硬著頭皮寫一點自己的心得。希望能
夠起到拋磚引玉的效果。
其實,我們在web頁面里實現(xiàn)“圖”的效果不一定非用GD不可,比較容易解決的是柱狀
圖——用HTML就可以解決。比如:
<? $b = array(150,110,125,180,160,175,230,220); ?>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title></title>
<style>
<!--
td{ font-size:9pt }
-->
</style>
</head>
<body>
<table border=0>
<tr valign="bottom">/* (1) */
<?for($i=0;$i<8;$i++) { ?><td align="center">
<table height="<?echo $b[$i];?>" border=0>/* (2) */
<tr>
<td bgcolor="#3F7F9F" width="40"></td> /* (3) */
</tr>
<br><font color="#3F7F9F"><?echo $b[$i];?></font> /* (4) */
</td><? } ?>
</tr>
</body>
</html>
<? $b = array(150,110,125,180,160,175,230,220); ?> 是一組數(shù)據(jù),數(shù)據(jù)從哪里來,是無
關(guān)大局的,就看你的需要了;代碼中需要說兩句的地方我都加了注釋,現(xiàn)在一一來說明。
(1) 這里要注意的是 valign="bottom",是為了讓單元格的內(nèi)容底部對齊。為什么加在<tr>里
呢?可以讓表格里這一行的內(nèi)容都遵循這一對齊方式,不必在每一個<td>里指定,這樣可
以使PHP執(zhí)行結(jié)果的HTML頁的原代碼節(jié)約好幾十個字節(jié)吶!節(jié)約瀏覽者的寶貴時間。
(2) 注意,最關(guān)鍵的東西在這里!<table height="xxx">,我們就是利用table的height屬性來
實現(xiàn)不同高度的“柱”的。我這里為了讓大家看得清楚,原始數(shù)據(jù)沒有經(jīng)過按比例的縮放,
如果你的數(shù)據(jù)特別大,或者特別小,都不適宜直接賦給table的height屬性,而應該根據(jù)情
況按適當比例縮放這些數(shù)據(jù)。比如你估計你的這組數(shù)據(jù)的每一個數(shù)字都會在3000~8000之間,
可以考慮將他們縮小25倍,即 height="<? echo floor(b[$i]/25); ?>"
(3) 提一下這一行里的 bgcolor="#xxxxxx",這是柱體的顏色(RGB)。其實,真正的柱狀圖應該
每一個柱體用一種顏色,這里為了代碼盡量簡單,我用了這個for循環(huán),因此也就沒辦法給
每一個柱體指定一種顏色!鋵嵰彩怯修k法的,我只是實在沒有必要為了這個例子再寫
一個抽取顏色的函數(shù)來把初學者搞暈。所以,那一部分由你自己去完善吧。
(4) 在這里以與柱體相同的顏色顯示真實的數(shù)據(jù)。當然,你也可以選擇把這個數(shù)字放在柱體的頂
上,可能更專業(yè)一些。然而我本人還是習慣于把它放在下面。
借助于HTML的table,我們可以構(gòu)造出各種柱狀圖,這個例子講的是用bgcolor來顯示色塊,
除此以外,還可以用 background="(圖片)" ,圖片是帶花紋的,于是柱狀圖的柱體就有了花紋。
而你把真實的數(shù)據(jù)用反差很大的顏色顯示在上面注釋(3)所示的那個<td>里,也是很好的效果。
前面是回避GD的一個有效的方法,但要做復雜的圖形,就非用GD不可了。
sadly 的PHP4中文手冊里,說GD函數(shù)庫里有44個函數(shù),但我看最新版的英文PHP4手冊里,
GD的函數(shù)已經(jīng)有80余個!由于筆者英文比較差,讀英文的手冊只能連蒙帶猜,所以不能確定
新的GD庫是否重新支持GIF了?不管怎樣,我認為,既然我們在使用完全免費的PHP,何必要
“冒險”去用有版權(quán)的GIF?何不免費到底,用PNG呢?只要你不需用動畫,PNG同樣可以做出
象GIF一樣小的文件!
下面我就結(jié)合一段程序,一句代碼一句代碼地說說常用的這些GD函數(shù)。
從開頭說起吧。
<?
Header("Content-type: image/png");
// 這是發(fā)送一個HTTP頭,告訴瀏覽器:“你聽著,這是一個圖象,可別當成文字來顯示呀!”
// 由于我個人的喜好,用了PNG,當然你也可以用 Header("Content-type: image/gif");
// 或者 Header("Content-type: image/jpeg");
$im = ImageCreate (50, 100);
// 創(chuàng)建圖象。注意,圖象在創(chuàng)建的時候還沒有被指定圖象格式。
// ImageCreate函數(shù),兩個參數(shù),無庸質(zhì)疑,這是創(chuàng)建的圖象的寬度和高度。
// 它的返回值是一個int數(shù)值,這個數(shù)值相當重要,你繼續(xù)繪制這個圖象、
// 直到你輸出這個圖象之前,無處不用到這個數(shù)值,我們暫且稱之為圖象的ID。
// 因為使用的頻率相當高,所以,我們把它賦給一個名字比較短的變量。
// 現(xiàn)在我們先畫一條線吧。畫線的函數(shù)是這樣的:
// imageline (int im, int x1, int y1, int x2, int y2, int col);
// 第一個參數(shù)im,就是圖象的ID,后面的 x1,y1,x2,y2,不用說了,
// 是起點(x1,y1) 終點(x2,y2)的坐標呀。▓D象的左上角坐標是 (0,0) )
// 最后一個參數(shù)是什么呀?是顏色!GD要求針對圖象定義顏色,用定義的這些顏色來作圖。
// 為什么要針對圖象定義顏色?我猜測,是為了GIF、PNG等圖象用之做“調(diào)色板”的。
// 這牽扯到圖象本身的知識,這里不贅述了。
// 所以,畫線之前,我們還要先定義顏色(真麻煩)。
// $col_red = ImageColorAllocate($im, 255,192,192);
// 這個函數(shù)四個參數(shù),第一個$im……還用得著我每次都說嘛?下次就不說啦!
// 后面三個參數(shù)就是要定義的顏色的紅(R)、綠(G)、藍(B)的分量,0~255之間。
// 這又牽扯到物理—光學的知識了。紅、綠、藍三原色光分量的不同,
// 產(chǎn)生了千變?nèi)f化的色彩。上面我定義的這個顏色,紅255,綠192,藍192。
// 如果沒有搞錯,這是一個較亮的紅色。等一會兒我們來畫一條線試試看。
// 為什么要等一會兒呢?因為一幅圖只有一種顏色的話,是什么也看不出來的!
// 我們把背景搞成黑的先!
// 雖然手冊上沒有明確表示,但是我發(fā)現(xiàn)最先定義的顏色將默認被作為背景。
$col_black = ImageColorAllocate($im, 0,0,0);
// 定義了一種顏色,紅光、綠光、藍光都沒有,自然黑咕隆咚——黑色。
// 然后再定義畫線用的顏色:
$col_red = ImageColorAllocate($im, 255,192,192);
// 現(xiàn)在可以開始畫紅線了:
imageline ($im, 10, 20, 45, 85, $col_red);
// 別急,這句完了以后你還看不到圖象。
ImagePNG($im);
// 這一句就輸出圖象了,ImagePNG()輸出png圖象,ImageJPEG輸出jpeg圖象,
// ImageGIF輸出gif圖象……
// 不要忘記這里有一個參數(shù),如果在屏幕顯示,而不是保存為文件,
// 則省略這個參數(shù)——保存的文件名。如果這里是要把它保存為文件,
// 就應該這樣寫:ImagePNG($im,"test.png");
// 如果不指定路徑,這個文件保存在你的web當前目錄里。
// 如果是JPEG,則再多一個參數(shù),是JPEG質(zhì)量(0~100)。
// 如果要在屏幕顯示,則 ImageJPEG($im,"",80);
// 如果要保存,則 ImageJPEG($im,"test.jpg",80);
// 注意,如果你要把這個圖象保存為文件,
// 就不能使用 Header("Content-type: image/png"); 傳送意味著圖象的HTTP頭,
// 因為一旦這樣,就表示你將輸出圖象。
ImageDestroy($im);
// 毀掉內(nèi)存里的圖象,以釋放內(nèi)存空間。
// 這樣就好了:一幅最簡單的GD作的圖作成了。
// 通過測試發(fā)現(xiàn),生成這幅圖象文件,用PNG格式只有131字節(jié),
// 而用JPEG格式,即便是用最差的質(zhì)量(0),也需要855字節(jié),圖象質(zhì)量糟糕得沒法看。
// 而最高的JPEG質(zhì)量,則需要2360字節(jié),色彩卻仍不如用PNG時的鮮艷。
// 由此可見,對于這種顏色數(shù)目少的圖象,用PNG比JPEG劃算得多。
?>
這一次先說到這里,我會爭取盡快繼續(xù)寫下去。