陈力:传智播客古代 珍宝币 泡泡龙游戏开发第48讲:PHP绘图技术
php绘图坐标体系中,坐标原点位于左上角,以像素为单位。php绘图时,要创建画布、画出各种图形、输出图形、销毁图形(释放内存资源)。本文结合贵阳网站建设中的php绘图实际应用验证码和饼状图进行介绍。陈力:传智播客古代 珍宝币 泡泡龙游戏开发第48讲:PHP绘图技术
一、php绘图技术
php绘图坐标体系中,坐标原点位于左上角,以像素为单位。像素是计算机屏幕上最小的显示单位。在php的坐标系中,第一个是x坐标,表示当前位置为水平方向,距离坐标原点x个像素;第二个是y坐标,表示当前位置为垂直方向,距离坐标原点y个像素。
绘图还必须要搞清一个非常重要的概念:像素一个像素等于多少厘米?
坐标体系-像素:
计算机在屏幕上显示的内容都是由屏幕上的每一个像素组成的。例如,计算机显示器的分辨率是800×600,表示计算机屏幕上的每一行由800个点组成,共有600行,整个计算机屏幕共有480 000个像素。现在的计算机可以支持更高的分辨率,也就是说,屏幕上可以显示更多的像素。 因此,像素是一个密度单位,而厘米是长度单位,两者无法比较。
二、php绘图的基本步骤
第一、创建画布
第二、画出各种图形
第三、输出图形(1. 输出到页面 2. 输出到一个文件,创建新图片)
第四、销毁图形(释放内存资源)
如果要使用php来绘制图片,则需要启用gd2库,在php.ini文件中
:extension=php_gd2.dll
我们贵阳网站建设中,常用的图片格式(jpg/jpeg, gif, png、bmp、WBMP,XBM)jpg/jpeg 图片网站中用的多,压缩率高,图片清晰,图片比较小,gif:支持动画,它支持256色,因为大量gif文件flash。Png:支持无损压缩,高保真。文件比较大。
我们先给大家写一个小案例,在面板上画一个小圆,然后借这个案例,来讲解php绘图技术原理。
<?php
//1.创建画布
$img1=imagecreatetruecolor(400,300) or die("失败");
//$img1=imagecreate(500,400);
//给画布(其实就是图片指定颜色,这个函数用于对imagecreate生效)
$black=imagecolorallocate($img1,0,0,0);
//填充区域[常常使用该函数去修改imagecreatetruecolor的画布背景图]
imagefill($img1,0,0,$black);
//2.画各种图形(圆,方,直线,弧线,矩形,多边形)
//直线
//创建一个颜色(第一次调用是给imagecreate创建的图像资源填充背景,第二次才能得到颜色
//给后续使用.)
$red=imagecolorallocate($img1,255,0,0);
//imageline($img1,0,0,100,100,$red);
//imageline($img1,30,30,30,100,$red);
//-----------------------------------------------
//画出矩形边框
//imagerectangle($img1,10,10,400,300,$red);
//-----------------------------------------------
//画出椭圆边框
//imageellipse($img1,30,30,60,60,$red);
//-----------------------------------------------
//画出填充矩形
//imagefilledrectangle($img1,0,0,400,300,$red);
//-----------------------------------------------
//画出填充的椭圆(这个30,30 是左上角的说法要考虑一下,我认为是)
//imagefilledellipse($img1,30,30,50,60,$red);
//-----------------------------------------------
//拷贝图片部分(相当于嵌入图片)[这里说明一下imagecopy的各个参数用法]
$my_pic=imagecreatefromjpeg("e.jpg");
//imagecopy($img1,$my_pic,10,10,0,0,298,334);
//如何更加灵活的copy 一幅图片.
$my_pic_inf=getimagesize("e.jpg");
//imagecopy($img1,$my_pic,10,10,0,0,$my_pic_inf[0],$my_pic_inf[1]);
//----------------------------------------------
//画出字符串(第二个参数是字体,php有1,2,3,4,5 内置字体,其实就是大小区别)
//20,20是字符的左上角.
// imagestring($img1,3,20,20,"hello",$red);
//如果输出的文字是中文,则使用imagettftext函数来处理
//注意这里是否需要使用$str=iconv("gbk","utf-8","你好");函数,要取决编辑器
//保存文本是不是utf-8,如果是,则不需要在转换,否则需要
imagettftext($img1,20,-30,20,25,$red,"STXINWEI.TTF","北京你好,韩顺平!");
//画出弧形线(前面的0,0表示中心点坐标,150,150表示椭圆的宽和高.0,90表示弧线的起始和终止的弧度)
//imagearc($img1, 0, 0, 150, 150, 0, 90, $red);
//画出扇形(坐标和前面的imagearc含义一样,不同的是imagefilledarc会填充)
imagefilledarc($img1, 60, 60, 80, 80, 0, 90, $red,IMG_ARC_PIE);
//3.输出图像(也可以保存图像)
header("content-type:image/png");
imagepng($img1);
//4.销毁图像(即回收资源)
imagedestroy($img1);
?>
三、绘图函数介绍
用法:
①画直线
②画矩形边框
③画椭圆边框
④填充矩形
⑤填充椭圆
⑥画图片(拷贝图片的一部分)
⑦画字符串
⑧画出弧形线
⑨画出扇形->可以做出3d效果的饼状图.
*********image1.php***********
<?php
//1.创建画布
$img1=imagecreatetruecolor(400,300) or die("失败");
//$img1=imagecreate(500,400);
//给画布(其实就是图片指定颜色,这个函数用于对imagecreate生效)
$black=imagecolorallocate($img1,0,0,0);
//填充区域[常常使用该函数去修改imagecreatetruecolor的画布背景图]
imagefill($img1,0,0,$black);
//2.画各种图形(圆,方,直线,弧线,矩形,多边形)
//直线
//创建一个颜色(第一次调用是给imagecreate创建的图像资源填充背景,第二次才能得到颜色
//给后续使用.)
$red=imagecolorallocate($img1,255,0,0);
//imageline($img1,0,0,100,100,$red);
//imageline($img1,30,30,30,100,$red);
//-----------------------------------------------
//画出矩形边框
//imagerectangle($img1,10,10,400,300,$red);
//-----------------------------------------------
//画出椭圆边框
//imageellipse($img1,30,30,60,60,$red);
//-----------------------------------------------
//画出填充矩形
//imagefilledrectangle($img1,0,0,400,300,$red);
//-----------------------------------------------
//画出填充的椭圆(这个30,30 是左上角的说法要考虑一下,我认为是)
//imagefilledellipse($img1,30,30,50,60,$red);
//-----------------------------------------------
//拷贝图片部分(相当于嵌入图片)[这里说明一下imagecopy的各个参数用法]
$my_pic=imagecreatefromjpeg("e.jpg");
//imagecopy($img1,$my_pic,10,10,0,0,298,334);
//如何更加灵活的copy 一幅图片.
$my_pic_inf=getimagesize("e.jpg");
//imagecopy($img1,$my_pic,10,10,0,0,$my_pic_inf[0],$my_pic_inf[1]);
//----------------------------------------------
//画出字符串(第二个参数是字体,php有1,2,3,4,5 内置字体,其实就是大小区别)
//20,20是字符的左上角.
// imagestring($img1,3,20,20,"hello",$red);
//如果输出的文字是中文,则使用imagettftext函数来处理
//注意这里是否需要使用$str=iconv("gbk","utf-8","你好");函数,要取决编辑器
//保存文本是不是utf-8,如果是,则不需要在转换,否则需要
imagettftext($img1,20,-30,20,25,$red,"STXINWEI.TTF","北京你好,韩顺平!");
//画出弧形线(前面的0,0表示中心点坐标,150,150表示椭圆的宽和高.0,90表示弧线的起始和终止的弧度)
//imagearc($img1, 0, 0, 150, 150, 0, 90, $red);
//画出扇形(坐标和前面的imagearc含义一样,不同的是imagefilledarc会填充)
imagefilledarc($img1, 60, 60, 80, 80, 0, 90, $red,IMG_ARC_PIE);
//3.输出图像(也可以保存图像)
header("content-type:image/png");
imagepng($img1);
//4.销毁图像(即回收资源)
imagedestroy($img1);
?>
********my_pie.php*********页面(这个可以参考帮助文档.)
<?php
// create image
$image = imagecreatetruecolor(400, 400);
// allocate some solors
$white = imagecolorallocate($image, 0xFF, 0xFF, 0xFF);
$gray = imagecolorallocate($image, 0xC0, 0xC0, 0xC0);
$darkgray = imagecolorallocate($image, 0x90, 0x90, 0x90);
$navy = imagecolorallocate($image, 0x00, 0x00, 0x80);
$darknavy = imagecolorallocate($image, 0x00, 0x00, 0x50);
$red = imagecolorallocate($image, 0xFF, 0x00, 0x00);
$darkred = imagecolorallocate($image, 0x90, 0x00, 0x00);
// make the 3D effect
for ($i = 60; $i > 50; $i--) {
imagefilledarc($image, 50, $i, 100, 50, 0, 45, $darknavy, IMG_ARC_PIE);
imagefilledarc($image, 50, $i, 100, 50, 45, 75 , $darkgray, IMG_ARC_PIE);
imagefilledarc($image, 50, $i, 100, 50, 75, 360 , $darkred, IMG_ARC_PIE);
}
imagefilledarc($image, 50, 50, 100, 50, 0, 45, $navy, IMG_ARC_PIE);
imagefilledarc($image, 50, 50, 100, 50, 45, 75 , $gray, IMG_ARC_PIE);
imagefilledarc($image, 50, 50, 100, 50, 75, 360 , $red, IMG_ARC_PIE);
// flush image
header('Content-type: image/png');
imagepng($image);
imagedestroy($image);
?>
陈力:传智播客古代 珍宝币 泡泡龙游戏开发第48讲:PHP绘图技术
四、php绘图实际应用——验证码
为什么需要验证码? 防止恶意灌水(灌水机器人),防止暴力破解(密码字典猜测用户名和密码) 。
***Login.php***
<html>
<head>
<title>xx</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
</head>
<h1>用户登录</h1>
<form action="LoginProcess.php" method="post">
<table>
<tr><td>u:</td><td><input type="text" name="username"/></td><td></td></tr>
<tr><td>p:</td><td><input type="password" name="password"/></td><td></td></tr>
<tr><td>验证码:</td><td><input type="text" name="checkcode"/></td><td><img src="checkCode.php" οnclick="this.src='checkCode.php?aa='+Math.random()" /></td></tr>
<tr><td><input type="submit" value="登录"/></td>
<td colspan="2"><input type="reset" value="重新填写"/></td></tr>
<table>
</form>
</html>
******CheckCode.php******
<?php
// echo rand(2,9);
// echo "<br/>".dechex(rand(1,15))."<br/>";
session_start();
$checkCode="";
for($i=0;$i<4;$i++){
$checkCode.=dechex(rand(1,15));
}
//讲随机验证码保存到session中
$_SESSION['myCheckCode']=$checkCode;
//创建图片,并把随机数画上去
$img=imagecreatetruecolor(110,30);
//背景默认就是黑色
//你可以指定背景颜色
$bgcolor=imagecolorallocate($img,0,0,0);
imagefill($img,0,0,$bgcolor);
//创建新的颜色
$white=imagecolorallocate($img,255,255,255);
$blue=imagecolorallocate($img,0,0,255);
$red=imagecolorallocate($img,255,0,0);
$green=imagecolorallocate($img,255,0,0);
//画出干扰线段
for($i=0;$i<20;$i++){
/*switch(rand(1,4)){
case 1:
imageline($img,rand(0,110),rand(0,30),rand(0,110),rand(0,30),$green);
break;
case 2:
imageline($img,rand(0,110),rand(0,30),rand(0,110),rand(0,30),$blue);
break;
case 3:
imageline($img,rand(0,110),rand(0,30),rand(0,110),rand(0,30),$green);
break;
case 4:
imageline($img,rand(0,110),rand(0,30),rand(0,110),rand(0,30),$red);
break;
}*/
//更好的方法是颜色随机
imageline($img,rand(0,110),rand(0,30),rand(0,110),rand(0,30),imagecolorallocate($img,rand(0,255),rand(0,255),rand(0,255)));
}
//画出噪点,自己画.
//for($i=0;$i<10;
//把四个随机值画上去
imagestring($img,rand(1,5),rand(2,80),rand(2,10),$checkCode,$white);
//如果要使用中文
//array imagefttext ( string $font_file , string $text [, array $extrainfo ] )
//imagettftext($img,15,10,20,25,$white,"STXINWEI.TTF","北京你好");
//输出
header("content-type: image/png");
imagepng($img);
?>
******LoginProcess.php***
<?php
//启用session
session_start();
//获取session中保存的验证码
$checkCodeInSession=$_SESSION["myCheckCode"];
//获取用户输入
$checkCode=$_POST["checkcode"];
echo "nook";
if($checkCode==$checkCodeInSession){
echo "ok";
}else{
echo "nook";
}
?>
*****
五、php绘图实际应用——饼状图
<?php
// create image
$image = imagecreatetruecolor(100, 400);
// allocate some solors
$white = imagecolorallocate($image, 0xFF, 0xFF, 0xFF);
$gray = imagecolorallocate($image, 0xC0, 0xC0, 0xC0);
$darkgray = imagecolorallocate($image, 0x90, 0x90, 0x90);
$navy = imagecolorallocate($image, 0x00, 0x00, 0x80);
$darknavy = imagecolorallocate($image, 0x00, 0x00, 0x50);
$red = imagecolorallocate($image, 0xFF, 0x00, 0x00);
$darkred = imagecolorallocate($image, 0x90, 0x00, 0x00);
imagefill($image,0,0,$white);
// make the 3D effect
for ($i = 70; $i > 50; $i--) {
imagefilledarc($image, 50, $i, 100, 50, 0, 45, $darknavy, IMG_ARC_PIE);
imagefilledarc($image, 50, $i, 100, 50, 45, 75 , $darkgray, IMG_ARC_PIE);
imagefilledarc($image, 50, $i, 100, 50, 75, 360 , $darkred, IMG_ARC_PIE);
}
imagefilledarc($image, 50, 50, 100, 50, 0, 45, $navy, IMG_ARC_PIE);
imagefilledarc($image, 50, 50, 100, 50, 45, 75 , $gray, IMG_ARC_PIE);
imagefilledarc($image, 50, 50, 100, 50, 75, 360 , $red, IMG_ARC_PIE);
// flush image
header('Content-type: image/png');
imagepng($image);
imagedestroy($image);
?>
【推荐阅读】陈力:传智播客古代 珍宝币 泡泡龙游戏开发第48讲:PHP绘图技术