打造超酷的PHP数据饼图效果实现代码

效果图:

源代码:
[code]
<?
//+------------------------+
//| pie3dfun.PHP//公用函数 |
//+------------------------+
define("ANGLE_STEP", 5); //定义画椭圆弧时的角度步长
function draw_getdarkcolor($img,$clr) //求$clr对应的暗色
{
$rgb = imagecolorsforindex($img,$clr);
return array($rgb["red"]/2,$rgb["green"]/2,$rgb["blue"]/2);
}
function draw_getexy($a, $b, $d) //求角度$d对应的椭圆上的点坐标
{
$d = deg2rad($d);
return array(round($a*Cos($d)), round($b*Sin($d)));
}
function draw_arc($img,$ox,$oy,$a,$b,$sd,$ed,$clr) //椭圆弧函数
{
$n = ceil(($ed-$sd)/ANGLE_STEP);
$d = $sd;
list($x0,$y0) = draw_getexy($a,$b,$d);
for($i=0; $i<$n; $i++)
{
$d = ($d+ANGLE_STEP)>$ed?$ed:($d+ANGLE_STEP);
list($x, $y) = draw_getexy($a, $b, $d);
imageline($img, $x0+$ox, $y0+$oy, $x+$ox, $y+$oy, $clr);
$x0 = $x;
$y0 = $y;
}
}
function draw_sector($img, $ox, $oy, $a, $b, $sd, $ed, $clr) //画扇面
{
$n = ceil(($ed-$sd)/ANGLE_STEP);
$d = $sd;
list($x0,$y0) = draw_getexy($a, $b, $d);
imageline($img, $x0+$ox, $y0+$oy, $ox, $oy, $clr);
for($i=0; $i<$n; $i++)
{
$d = ($d+ANGLE_STEP)>$ed?$ed:($d+ANGLE_STEP);
list($x, $y) = draw_getexy($a, $b, $d);
imageline($img, $x0+$ox, $y0+$oy, $x+$ox, $y+$oy, $clr);
$x0 = $x;
$y0 = $y;
}
imageline($img, $x0+$ox, $y0+$oy, $ox, $oy, $clr);
list($x, $y) = draw_getexy($a/2, $b/2, ($d+$sd)/2);
imagefill($img, $x+$ox, $y+$oy, $clr);
}
function draw_sector3d($img, $ox, $oy, $a, $b, $v, $sd, $ed, $clr) //3d扇面
{
draw_sector($img, $ox, $oy, $a, $b, $sd, $ed, $clr);
if($sd<180)
{
list($R, $G, $B) = draw_getdarkcolor($img, $clr);
$clr=imagecolorallocate($img, $R, $G, $B);
if($ed>180) $ed = 180;
list($sx, $sy) = draw_getexy($a,$b,$sd);
$sx += $ox;
$sy += $oy;
list($ex, $ey) = draw_getexy($a, $b, $ed);
$ex += $ox;
$ey += $oy;
imageline($img, $sx, $sy, $sx, $sy+$v, $clr);
imageline($img, $ex, $ey, $ex, $ey+$v, $clr);
draw_arc($img, $ox, $oy+$v, $a, $b, $sd, $ed, $clr);
list($sx, $sy) = draw_getexy($a, $b, ($sd+$ed)/2);
$sy += $oy+$v/2;
$sx += $ox;
imagefill($img, $sx, $sy, $clr);
}
}
function draw_getindexcolor($img, $clr) //RBG转索引色
{
$R = ($clr>>16) & 0xff;
$G = ($clr>>8)& 0xff;
$B = ($clr) & 0xff;
return imagecolorallocate($img, $R, $G, $B);
}
// 绘图主函数,并输出图片
// $datLst 为数据数组, $datLst 为标签数组, $datLst 为颜色数组
// 以上三个数组的维数应该相等
function draw_img($datLst,$labLst,$clrLst,$a=250,$b=120,$v=20,$font=10)
{
$ox = 5+$a;
$oy = 5+$b;
$fw = imagefontwidth($font);
$fh = imagefontheight($font);
$n = count($datLst);//数据项个数
$w = 10+$a*2;
$h = 10+$b*2+$v+($fh+2)*$n;
$img = imagecreate($w, $h);
//转RGB为索引色
for($i=0; $i<$n; $i++)
$clrLst[$i] = draw_getindexcolor($img,$clrLst[$i]);
$clrbk = imagecolorallocate($img, 0xff, 0xff, 0xff);
$clrt = imagecolorallocate($img, 0x00, 0x00, 0x00);
//填充背景色
imagefill($img, 0, 0, $clrbk);
//求和
$tot = 0;
for($i=0; $i<$n; $i++)
$tot += $datLst[$i];
$sd = 0;
$ed = 0; 333
$ly = 10+$b*2+$v;
for($i=0; $i<$n; $i++)
{
$sd = $ed;
$ed += $datLst[$i]/$tot*360;
//画圆饼
draw_sector3d($img, $ox, $oy, $a, $b, $v, $sd, $ed, $clrLst[$i]); //$sd,$ed,$clrLst[$i]);
//画标签
imagefilledrectangle($img, 5, $ly, 5+$fw, $ly+$fh, $clrLst[$i]);
imagerectangle($img, 5, $ly, 5+$fw, $ly+$fh, $clrt);
//imagestring($img, $font, 5+2*$fw, $ly, $labLst[$i].":".$datLst[$i]."(".(round(10000*($datLst[$i]/$tot))/100)."%)", $clrt);
$str = iconv("GB2312", "UTF-8", $labLst[$i]);
ImageTTFText($img, $font, 0, 5+2*$fw, $ly+13, $clrt, "./simsun.ttf", $str.":".$datLst[$i]."(".(round(10000*($datLst[$i]/$tot))/100)."%)");
$ly += $fh+2;
}
//输出图形
header("Content-type: image/png");
//输出生成的图片
$imgFileName = "../temp/".time().".png";
imagepng($img,$imgFileName);
echo '''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''''
}
$datLst = array(30, 10, 20, 20, 10, 20, 10, 20); //数据
$labLst = array("中国科技大学", "安徽理工大学", "清华大学", "北京大学", "南京大学", "上海大学", "河海大学", "中山大学"); //标签
$clrLst = array(0x99ff00, 0xff6666, 0x0099ff, 0xff99ff, 0xffff99, 0x99ffff, 0xff3333, 0x009999);
//画图
draw_img($datLst,$labLst,$clrLst);
?>

(0)

相关推荐

  • 打造超酷的PHP数据饼图效果实现代码

    效果图:源代码: [code] <? //+------------------------+ //| pie3dfun.PHP//公用函数 | //+------------------------+ define("ANGLE_STEP", 5); //定义画椭圆弧时的角度步长 function draw_getdarkcolor($img,$clr) //求$clr对应的暗色 { $rgb = imagecolorsforindex($img,$clr); return a

  • Android 自定义 HorizontalScrollView 打造多图片OOM 的横向滑动效果(实例代码)

    自从Gallery被谷歌废弃以后,Google推荐使用ViewPager和HorizontalScrollView来实现Gallery的效果.的确HorizontalScrollView可以实现Gallery的效果,但是HorizontalScrollView存在一个很大的问题,如果你仅是用来展示少量的图片,应该是没问题的,但是如果我希望HorizontalScrollView可以想ViewPager一样,既可以绑定数据集(动态改变图片),还能做到,不管多少图片都不会OOM(ViewPager内

  • 通过JQuery实现win8一样酷炫的动态磁贴效果(示例代码)

    我个人表示非常喜欢微软新一代的产品,先不管它产品的成熟与否,但是它带来的是全新的产品.所谓全新,是指在用户体验上,苹果这些年的成功使得所有产品都在模仿它的界面,包括安卓在内,不知道大家的感觉如何,反正我是对这些圆角矩形产生了审美疲劳(苹果以及安卓的粉丝勿喷,这里仅仅是从界面上评价,事实上从整体上来说,微软还是有差距的),当年wp的推出让我眼前一亮,马上喜欢上了Metro风格的产品,直至今天wp8以及win8开始越来越成熟. 写的不好,欢迎各位看官指正批评,不欢迎无故猛喷.大神请绕道. 废话少说,

  • HTML5+jQuery插件Quicksand实现超酷的星际争霸2兵种分类展示效果(附demo源码下载)

    本文讲述了HTML5+jQuery插件Quicksand实现超酷的星际争霸2兵种分类展示效果.分享给大家供大家参考,具体如下: 因为本人是星际争霸系列游戏的忠实拥簇,所以在今天的jQuery教程中,我们将使用HTML5和jQuery插件Quicksand来创建一个超酷的星际争霸兵种效果图.希望大家喜欢! 先来看看效果图: HTML5代码 首先我们使用HTML5的代码来创建一个html文档,将所需的quicksand类库,及其jquery类库,还有HTML5类库倒入,如下: <!DOCTYPE h

  • jQuery实现的超酷苹果风格图标滑出菜单效果代码

    本文实例讲述了jQuery实现的超酷苹果风格图标滑出菜单效果代码.分享给大家供大家参考.具体如下: 这是一款超酷苹果风格图标滑出菜单,调用了jquery1.3.2的库文件,整个菜单动感十足,用在网站上增色不少. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-apple-style-ico-show-menu-codes/ 具体代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0

  • jQuery超酷平面式时钟效果代码分享

    本文实例讲述了jQuery超酷平面式时钟效果代码.分享给大家供大家参考.具体如下: jQuery制作的超酷平面式时钟效果,把日期和时间通过横向刻度条展现,经测试效果非常酷,是一个很不错的学习实例. 这里我们还要提到之前实现的另一个特别新颖的时间显示样式:js实现温度计时间样式,两者都完全突破了传统的时钟概念,感兴趣的各位可不要错过了哈. 运行效果图:----------------------查看效果 下载源码----------------------- 小提示:浏览器中如果不能正常运行,可以

  • JavaScript SweetAlert插件实现超酷消息警告框

    今天给大家推荐一款不错的超酷消息警告框–SweetAlert:SweetAlert是一款不需要jQuery支持的原生js提示框,风格类似bootstrap.它的提示框不仅美丽动人,并且允许自定义,支持设置提示框标题.提示类型.内容展示图片.确认取消按钮文本.点击后回调函数等.和传统的alert相比: SweetAlert 能在页面自动居中,支持桌面环境,移动端和平板,并且高度自定义.接下来看看它的具体使用! HTML 首先引入相应的js和css,该插件不需要jQuery插件的支持: <link

  • js实现超酷的照片墙展示效果图附源码下载

    这是一个超酷的照片墙展示效果,很多照片结合淡入淡出.旋转.缩放.倾斜及3D效果,照片快速从左侧切入,做旋转3D效果,最后在照片墙上整齐排列,为用户展示了超酷的照片墙展示效果. 查看演示 下载源码 HTML 本文结合实例给大家分享超酷的照片墙效果,该效果依赖jQuery和easing插件,因此首先载入这两个文件. <script src="jquery.min.js"></script> <script src="jquery.easing.1.3

  • Android打造炫酷的电影票在线选座app在线选座功能

    不知道大家有没有用过,淘宝电影客户端(淘票票)买过电影票,纵观各类在线选座app的在线选座功能 淘宝在线选座功能用户体验最好,用起来最顺手,夸张点说已经到了炉火纯青的地步,下面我们看一下效果: 效果分析: 整个控件分成几个部分,座位图区域.座位缩略图区域.行号区域.屏幕区域 1.座位图可以自由的移动缩放,放大缩小移动后会自动回弹到合适的位置,选中座位会自动放大到合适比例. 2.行号部分跟着座位图缩放以及上下移动,屏幕区域跟着座位图左右移动缩放. 3.当手指按下的时候会出现缩略图,缩略图上有个红色

  • vue+highcharts实现3D饼图效果

    本文实例为大家分享了vue+highcharts实现3D饼图效果的具体代码,供大家参考,具体内容如下 这是最终效果 <template> <div class="big-box">   <div class="com-container" ref="container" style="width:380px;height:300px;">   </div>   <div c

随机推荐