分享
 
 
 

PHP 创建用于统计的图形

王朝php·作者佚名  2006-01-09
窄屏简体版  字體: |||超大  

PHP有一个令人惊讶的能力——你可以利用它的服务器端脚本创建动态图形。这项功能的基础是GD库,它是由Thomas Boutell设计的ANSI C库,这个库支持除.GIF文件之外的绝大多数常见图形文件格式(不过该库的设计者许诺当LZW专利在2004年7月7日到期后就立即添加.GIF支持)。

PHP4.3以及它的更高版本集成了GD库。如果你使用的是老版本的PHP,你需要手工安装图形支持。这儿有许多与之有关的信息。

折线图

为了演示如何用PHP创建动态图形,我们建立一些自定义图形。第一个例子是画在网格上的折线图,如图A所示。

图A

我们把这个页面叫着grid.php(相关附件:清单A)。为了调用Web页动态产生的图形,你只需要访问这个PHP页,它将该图形传递到浏览器。IMG元素可以很好的完成这项工作。下面是实现这个功能的例子代码:

<imgsrc="grid.php" />

现在,我们开始编写用于创建图形的代码。下面是grid.php中源代码片断:

<?

//添加图形的值

$graphValues=array(0,80,23,11,190,245,50,80,111,240,55);

首先,我们定义图形的值。在这个例子中,图形值直接写到代码中的一个数组中,不过你可以很容易改写代码,让代码从XML文件、表格或者数据库中获取这些值。这些值的范围从0到250(以象素为单位的图形尺寸)。这些值将决定每个网格上线段的初始象素位置。如果你想使用数值0和100(用百分比表示),你只需把这些值乘以2.5来决定网格上的象素位置。

然后,我们发送一个PNG头并定义图像的高度和宽度:

// Define .PNG image

header("Content-type: image/png");

$imgWidth=250;

$imgHeight=250;

我们发送一个图形头来“欺骗”浏览器,使它认为我们的PHP页面是一幅真正的图像,这样它才可以正确显示在屏幕上。服务器将以二进制数据流的形式把程序产生的信息发送到浏览器。

PNG(Portable Network Graphic,便携式网路图形)标准是一种无损的图形格式,它由于GIF的 LZW算法专利这一法律问题而在1995年提出来的。

现在,我们例化图形对象并定义我们在图形中用到的颜色:

//创建图像、定义颜色

$image=imagecreate($imgWidth, $imgHeight);

$colorWhite=imagecolorallocate($image, 255, 255, 255);

$colorGrey=imagecolorallocate($image, 192, 192, 192);

$colorBlue=imagecolorallocate($image, 0, 0, 255);

我们设置白色背景,灰色画框以及蓝色折线。你可以通过创建新变量并赋不同的RGB值来轻松的修改或者添加颜色。

我们可以用imageline函数来创建灰色画框,每次调用这个函数就画一条线:

//创建图像周围的框

imageline($image, 0, 0, 0, 250, $colorGrey);

imageline($image, 0, 0, 250, 0, $colorGrey);

imageline($image, 249, 0, 249, 249, $colorGrey);

imageline($image, 0, 249, 249, 249, $colorGrey);

这里用到了二维的x/y象素坐标。Imageline函数中的每一对值指定了图像的起点和终点。

为了实现网格线,我们在x坐标轴和y坐标轴上每隔25个象素画一条灰线:

//创建网格

for ($i=1; $i<11; $i++){

imageline($image, $i*25, 0, $i*25, 250, $colorGrey);

imageline($image, 0, $i*25, 250, $i*25, $colorGrey);

}

位置(0,0)表示网格的左上角,位置(250,250)表示右下角。每个坐标轴等分为10格,每格宽度是25个象素,即250个象素(图形的尺寸)。

为了创建折线图,我们只需循环的取出数组中的坐标值,按坐标画出每条线段的起点和终点:

//创建折线图

for ($i=0; $i<10; $i++){

imageline($image, $i*25, (250-$graphValues[$i]), ($i+1)*25, (250-$graphValues[$i+1]), $colorBlue);

}

PHP将会自动在起点和终点之间填充蓝线。在这个简单的例子中只有10个值,但是扩展这个技术非常容易,如创建类似股指示意图那样的复杂图形等等。

最后,我们需要把这个图像输出到浏览器并清空服务器中保存图像的内存空间:

//输出图形并清楚内存中的图像

imagepng($image);

imagedestroy($image);

?>

直方图

把上面用于创建折线图的基本程序修改后用于创建直方图(如图B所示)。

图B

(相关附件:清单B)这段程序与我们上面用来画折线图的代码略有不同。Imagefilledrectangle函数创建两种直方块——深色的直方块表示$graphValues数组中保存的值,而浅色直方块则用于填充深色方块之间的空隙:

//创建直方图

for ($i=0; $i<10; $i++){

imagefilledrectangle($image, $i*25, (250-$graphValues[$i]), ($i+1)*25, 250, $colorDarkBlue);

imagefilledrectangle($image, ($i*25)+1, (250-$graphValues[$i])+1, (($i+1)*25)-5, 248, $colorLightBlue);

}

留心CPU的负荷

当你在服务器端创建这些图形时,你需要仔细考虑这个问题:CPU负荷。如果你在Web端有太多这样的动态图片产生任务,你可能会发现导致性能下降。

更复杂的用法

本文所列举的例子仅仅是个起点。如果你想得到有关PHP图形库的更多信息,请查看PHP手册上的的图形函数网页

<?

########### Listing A ####################

// Add values to the graph

$graphValues=array(0,80,23,11,190,245,50,80,111,240,55);

// Define .PNG image

header("Content-type: image/png");

$imgWidth=250;

$imgHeight=250;

// Create image and define colors

$image=imagecreate($imgWidth, $imgHeight);

$colorWhite=imagecolorallocate($image, 255, 255, 255);

$colorGrey=imagecolorallocate($image, 192, 192, 192);

$colorBlue=imagecolorallocate($image, 0, 0, 255);

// Create border around image

imageline($image, 0, 0, 0, 250, $colorGrey);

imageline($image, 0, 0, 250, 0, $colorGrey);

imageline($image, 249, 0, 249, 249, $colorGrey);

imageline($image, 0, 249, 249, 249, $colorGrey);

// Create grid

for ($i=1; $i<11; $i++){

imageline($image, $i*25, 0, $i*25, 250, $colorGrey);

imageline($image, 0, $i*25, 250, $i*25, $colorGrey);

}

// Add in graph values

for ($i=0; $i<10; $i++){

imageline($image, $i*25, (250-$graphValues[$i]), ($i+1)*25, (250-$graphValues[$i+1]), $colorBlue);

}

// Output graph and clear image from memory

imagepng($image);

imagedestroy($image);

?>

<?

############ Listing B ##################

// Add values to the graph

$graphValues=array(0,80,23,11,190,245,50,80,111,240,55);

// Define .PNG image

header("Content-type: image/png");

$imgWidth=250;

$imgHeight=250;

// Create image and define colors

$image=imagecreate($imgWidth, $imgHeight);

$colorWhite=imagecolorallocate($image, 255, 255, 255);

$colorGrey=imagecolorallocate($image, 192, 192, 192);

$colorDarkBlue=imagecolorallocate($image, 104, 157, 228);

$colorLightBlue=imagecolorallocate($image, 184, 212, 250);

// Create border around image

imageline($image, 0, 0, 0, 250, $colorGrey);

imageline($image, 0, 0, 250, 0, $colorGrey);

imageline($image, 249, 0, 249, 249, $colorGrey);

imageline($image, 0, 249, 249, 249, $colorGrey);

// Create grid

for ($i=1; $i<11; $i++){

imageline($image, $i*25, 0, $i*25, 255, $colorGrey);

imageline($image, 0, $i*25, 255, $i*25, $colorGrey);

}

// Create bar charts

for ($i=0; $i<10; $i++){

imagefilledrectangle($image, $i*25, (250-$graphValues[$i]), ($i+1)*25, 250, $colorDarkBlue);

imagefilledrectangle($image, ($i*25)+1, (250-$graphValues[$i])+1, (($i+1)*25)-5, 248, $colorLightBlue);

}

// Output graph and clear image from memory

imagepng($image);

imagedestroy($image);

?>

 
 
 
免责声明:本文为网络用户发布,其观点仅代表作者个人观点,与本站无关,本站仅提供信息存储服务。文中陈述内容未经本站证实,其真实性、完整性、及时性本站不作任何保证或承诺,请读者仅作参考,并请自行核实相关内容。
2023年上半年GDP全球前十五强
 百态   2023-10-24
美众议院议长启动对拜登的弹劾调查
 百态   2023-09-13
上海、济南、武汉等多地出现不明坠落物
 探索   2023-09-06
印度或要将国名改为“巴拉特”
 百态   2023-09-06
男子为女友送行,买票不登机被捕
 百态   2023-08-20
手机地震预警功能怎么开?
 干货   2023-08-06
女子4年卖2套房花700多万做美容:不但没变美脸,面部还出现变形
 百态   2023-08-04
住户一楼被水淹 还冲来8头猪
 百态   2023-07-31
女子体内爬出大量瓜子状活虫
 百态   2023-07-25
地球连续35年收到神秘规律性信号,网友:不要回答!
 探索   2023-07-21
全球镓价格本周大涨27%
 探索   2023-07-09
钱都流向了那些不缺钱的人,苦都留给了能吃苦的人
 探索   2023-07-02
倩女手游刀客魅者强控制(强混乱强眩晕强睡眠)和对应控制抗性的关系
 百态   2020-08-20
美国5月9日最新疫情:美国确诊人数突破131万
 百态   2020-05-09
荷兰政府宣布将集体辞职
 干货   2020-04-30
倩女幽魂手游师徒任务情义春秋猜成语答案逍遥观:鹏程万里
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案神机营:射石饮羽
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案昆仑山:拔刀相助
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案天工阁:鬼斧神工
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案丝路古道:单枪匹马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:与虎谋皮
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:李代桃僵
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案镇郊荒野:指鹿为马
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:小鸟依人
 干货   2019-11-12
倩女幽魂手游师徒任务情义春秋猜成语答案金陵:千金买邻
 干货   2019-11-12
 
推荐阅读
 
 
 
>>返回首頁<<
 
靜靜地坐在廢墟上,四周的荒凉一望無際,忽然覺得,淒涼也很美
© 2005- 王朝網路 版權所有