欢迎各位兄弟 发布技术文章

这里的技术是共享的

You are here

首页

奉献一个PHP版的动态三维饼状图 仅对ie好用 不太好用

shiping1 的头像
星期三, 2016-01-13 11:36 — shiping1
上次看到金翅擘海给的静态三维饼状图很是心动；终于变成PHP版了；需要的同志拿去用吧 

加上了注释；大多数人应该可以看明白了
  1. <?php
  2. //参数含义(数组，横坐标，纵坐标，图表的宽度，图表的高度,图表标题,单位)
  3. function table2($stat_array,$table_left,$table_top,$all_width,$all_height,$table_title,$unit){
  4.        $bg_color[1]="#ff1919";//定义各个色块的颜色；如果你觉得10个还不够；请继续定义
  5.        $bg_color[2]="#ffff19";
  6.        $bg_color[3]="#1919ff";
  7.        $bg_color[4]="#19ff19";
  8.        $bg_color[5]="#fc0";
  9.        $bg_color[6]="#3cc";
  10.        $bg_color[7]="#ff19ff";
  11.        $bg_color[8]="#993300";
  12.        $bg_color[9]="#f60";
  13.        $bg_color[10]="#ff8c19";
  14.            $T_N = count($stat_array)+1;//计算传入的数组item数目
  15.        $num =max($T_N,1);//取数组值和1中的最大值；直接写成$num =count($stat_array)+1;也行；当时没考虑仔细:D
  16.        $allvalues=0;
  17.        for($i=1;$i<$num;$i++) $allvalues = $allvalues+$stat_array[$i][1];//计算总值
  18.        $k=0;
  19.        for($i=1;$i<$num-1;$i++){
  20.                           $pie[$i]=sprintf ("%01.4f", $stat_array[$i][1]/$allvalues);//计算每块所站的比例；取小数点后4位
  21.               $k=$k+$pie[$i];}
  22.        $pie[$num]=sprintf ("%01.4f", (1-$k));
  23.        echo "<v:shapetype id='Cake_3D' coordsize='21600,21600' o:spt='95' adj='11796480,5400' path='al10800,10800@0@0@2@14,10800,10800,10800,10800@3@15xe'></v:shapetype>";//以下开始输出VML；可以不改
  24.        echo "<v:shapetype id='3dtxt' coordsize='21600,21600' o:spt='136' adj='10800' path='m@7,l@8,m@5,21600l@6,21600e'> ";
  25.        echo " <v:path textpathok='t' o:connecttype='custom' o:connectlocs='@9,0;@10,10800;@11,21600;@12,10800' o:connectangles='270,180,90,0'/>";
  26.        echo " <v:textpath on='t' fitshape='t'/>";
  27.        echo " <o:lock v:ext='edit' text='t' shapetype='t'/>";
  28.        echo "</v:shapetype>";
  29.        echo "<v:rect id='background' style='position:absolute;left:".$table_left."px;top:".$table_top."px;WIDTH:".$all_width."px;HEIGHT:".$all_height."px;' fillcolor='#EFEFEF' strokecolor='gray'>";
  30.        echo " <v:shadow on='t' type='single' color='silver' offset='4pt,4pt'/>";
  31.        echo "</v:rect>";
  32.        echo "<v:group ID='table' style='position:absolute;left:".$table_left."px;top:".$table_top."px;WIDTH:".$all_width."px;HEIGHT:".$all_height."px;' coordsize = '21000,11500'>" ;
  33.        echo " <v:Rect style='position:relative;left:500;top:200;width:20000;height:800'filled='false' stroked='false'>";
  34.        echo " <v:TextBox inset='0pt,0pt,0pt,0pt'>";
  35.        echo " <table width='100%' border='0' align='center' cellspacing='0'>";
  36.        echo " <tr>";
  37.        echo " <td align='center' valign='middle'><div style='font-size:15pt; font-family:黑体;'><B>".$table_title."</B></div></td>";
  38.        echo " </tr>";
  39.        echo " </table>";
  40.        echo " </v:TextBox>";
  41.        echo " </v:Rect> ";
  42.        echo " <v:rect id='back' style='position:relative;left:500;top:1000;width:20000; height:10000;' onmouseover='movereset(1)' onmouseout='movereset(0)' fillcolor='#9cf' strokecolor='#888888'>";
  43.        echo " <v:fill rotate='t' angle='-45' focus='100%' type='gradient'/>";
  44.        echo " </v:rect>";
  45.        echo " <v:rect id='back' style='position:relative;left:15000;top:1400;width:5000; height:".(($num+1)*9000/11+200).";' fillcolor='#9cf' stroked='t' strokecolor='#0099ff'>";
  46.        echo " <v:fill rotate='t' angle='-175' focus='100%' type='gradient'/>";
  47.        echo " <v:shadow on='t' type='single' color='silver' offset='3pt,3pt'/>";
  48.        echo " </v:rect>";
  49.        echo " <v:Rect style='position:relative;left:15500;top:1500;width:4000;height:700' fillcolor='#000000' stroked='f' strokecolor='#000000'>";
  50.        echo " <v:TextBox inset='8pt,4pt,3pt,3pt' style='font-size:11pt;'><div align='left'><font color='#ffffff'><B>总数:".$allvalues.$unit."</B> </font></div></v:TextBox>";
  51.        echo " </v:Rect> " ;
  52.        for($i=1;$i<$num;$i++){
  53.               echo " <v:Rect id='rec".$i."' style='position:relative;left:15400;top:".($i*9000/11+1450).";width:4300;height:800;display:none' fillcolor='#efefef' strokecolor='".$bg_color[$i]."'>";
  54.               echo " <v:fill opacity='.6' color2='fill darken(118)' o:opacity2='.6' rotate='t' method='linear sigma' focus='100%' type='gradient'/>";
  55.                          // echo " <v:fill opacity='60293f' color2='fill lighten(120)' o:opacity2='60293f' rotate='t' angle='-135' method='linear sigma' focus='100%' type='gradient'/>";
  56.               echo " </v:Rect>";
  57.               echo " <v:Rect style='position:relative;left:15500;top:".($i*9000/11+1500).";width:600;height:700' fillcolor='".$bg_color[$i]."' stroked='f'/>";
  58.               echo " <v:Rect style='position:relative;left:16300;top:".($i*9000/11+1500).";width:3400;height:700' filled='f' stroked='f'>";
  59.               echo " <v:TextBox inset='0pt,5pt,0pt,0pt' style='font-size:9pt;'><div align='left'>".$stat_array[$i][2].":".$stat_array[$i][1].$unit."</div></v:TextBox>";
  60.               echo " </v:Rect> " ;}
  61.        echo "</v:group>";
  62.        $k1=180;
  63.        $k4=10;
  64.        for($i=1;$i<$num;$i++){
  65. echo "<a href='james.php'>";
  66.              $k2=360*$pie[$i]/2;
  67.               $k3=$k1+k2;
  68.               if($k3>=360) $k3=$k3-360;
  69.               $kkk=(-11796480*$pie[$i]+5898240);
  70.               $k5=3.1414926*2*(180-($k3-180))/360;
  71.               $R=$all_height/2;
  72.               $txt_x = $table_left+$all_height/8-30+$R+$R*sin($k5)*0.7;
  73.               $txt_y = $table_top+$all_height/14-39+$R+$R*cos($k5)*0.7*0.5;
  74.               $titlestr = "名称：".$stat_array[$i][2]." 数值：".$stat_array[$i][1].$unit." 所占比例：".($pie[$i]*100)."%";
  75.               echo " <div style='cursor:hand;'>";
  76.               echo " <v:shape id='cake".$i."' type='#Cake_3D' title='".$titlestr."'";
  77.               echo " style='position:absolute;left:".($table_left+$all_height/8)."px;top:".($table_top+$all_height/14)."px;WIDTH:".$all_height."px;HEIGHT:".$all_height."px;rotation:".$k3.";z-index:".$k4."'";
  78.               echo " adj='".$kkk.",0' fillcolor='".$bg_color[$i]."' onmouseover='moveup(cake".$i.",".($table_top+$all_height/14).",txt".$i.",rec".$i.")'; onmouseout='movedown(cake".$i.",".($table_top+$all_height/14).",txt".$i.",rec".$i.");'>";
  79.               echo " <v:fill opacity='60293f' color2='fill lighten(120)' o:opacity2='60293f' rotate='t' angle='-135' method='linear sigma' focus='100%' type='gradient'/>";
  80.               echo " <o:extrusion v:ext='view' on='t'backdepth='25' rotationangle='60' viewpoint='0,0'viewpointorigin='0,0' skewamt='0' lightposition='-50000,-50000' lightposition2='50000'/>";
  81.               echo " </v:shape>";
  82.               echo " <v:shape id='txt".$i."' type='#3dtxt' style='position:absolute;left:".$txt_x."px;top:".$txt_y."px;z-index:20;display:none;width:50; height:18;' fillcolor='#ffffff'";
  83.               echo " onmouseover=ontxt(cake".$i.",".($table_top+$all_height/14).",txt".$i.",rec".$i.")>";
  84.               echo " <v:fill opacity='60293f' color2='fill lighten(120)' o:opacity2='60293f' rotate='t' angle='-135' method='linear sigma' focus='100%' type='gradient'/>";
  85.               echo " <v:textpath style='font-family:'宋体';v-text-kern:t' trim='t' fitpath='t' string='".($pie[$i]*100)."%'/>";
  86.               echo " <o:extrusion v:ext='view' backdepth='8pt' on='t' lightposition='0,0' lightposition2='0,0'/>";
  87.               echo " </v:shape>" ;
  88.               echo " </div>";
  89.               $k1=$k1+$k2*2;
  90.               if ($k1>=360)$k1=$k1-360;
  91.               if ($k1>180) $k4=$k4+1;
  92.               else $k4=$k4-1;
  93. echo "</a>";
  94.       }
  95. }
  96. ?>
  97. <html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
  98. <head>
  99. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  100. <title></title>
  101. <STYLE>
  102. v\:* { Behavior: url(#default#VML) }
  103. o\:* { behavior: url(#default#VML) }
  104. </STYLE>
  105. </head>
  106. <body>
  107. <SCRIPT type="text/javascript">//定义操作饼状图的JS函数
  108. <!--
  109. onit=true
  110. num=0
  111. function moveup(iteam,top,txt,rec){
  112. temp=eval(iteam)
  113. tempat=eval(top)
  114. temptxt=eval(txt)
  115. temprec=eval(rec)
  116. at=parseInt(temp.style.top)
  117. temprec.style.display = "";
  118. if (num>27){
  119. temptxt.style.display = "";
  120. }
  121. if(at>(tempat-28)&&onit){
  122. num++
  123. temp.style.top=at-1
  124. Stop=setTimeout("moveup(temp,tempat,temptxt,temprec)",10)
  125. }else{
  126. return
  127. }
  128. }
  129. function movedown(iteam,top,txt,rec){
  130. temp=eval(iteam)
  131. temptxt=eval(txt)
  132. temprec=eval(rec)
  133. clearTimeout(Stop)
  134. temp.style.top=top
  135. num=0
  136. temptxt.style.display = "none";
  137. temprec.style.display = "none";
  138. }
  139. function ontxt(iteam,top,txt,rec){
  140. temp = eval(iteam);
  141. temptxt = eval(txt);
  142. temprec = eval(rec)
  143. if (onit){
  144. temp.style.top = top-28;
  145. temptxt.style.display = "";
  146. temprec.style.display = "";
  147. }
  148. }
  149. function movereset(over){
  150. if (over==1){
  151. onit=false
  152. }else{
  153. onit=true
  154. }
  155. }
  156. -->
  157. </script>
  158. </body>
  159. </html> 
  160. <?php
  161. //传入数组；这里就是用的人要改的地方了；数组从数据库或其他地方得到:D 
  162.  
  163. $total[1][1]=2000;
  164. $total[2][1]=1800;
  165. $total[3][1]=1700;
  166. $total[4][1]=1500;
  167. $total[5][1]=1222;
  168. $total[6][1]=1100;
  169. $total[7][1]=1000;
  170. $total[8][1]=800;
  171. $total[9][1]=700;
  172. $total[10][1]=600;
  173. $total[1][2]="项目1";
  174. $total[2][2]="项目2";
  175. $total[3][2]="项目3";
  176. $total[4][2]="项目4";
  177. $total[5][2]="项目5";
  178. $total[6][2]="项目6";
  179. $total[7][2]="项目7";
  180. $total[8][2]="项目8";
  181. $total[9][2]="项目9";
  182. $total[10][2]="项目10";
  183. table2($total,120,20,900,500,"三维饼状图","元");//调用函数
  184. //参数含义(数组，横坐标，纵坐标，图表的宽度，图表的高度,图表标题,单位)
  185. ?>
复制代码

[[i] 本帖最后由 yxljames 于 2008-5-20 19:36 编辑 ]


有一个重叠啦
有些缺点，
一没有写成函数或类，这样散装品大家不是很好用，
二不能根据外部传入的数组决定他块数，不过这个更改起来比较容易，希望楼主能够封装下，
三用GD库可能会减少代码量当然效果可能没这么好。

已经是函数了啊
//参数含义(数组，横坐标，纵坐标，图表的宽度，图表的高度,图表标题,单位)
function table2($stat_array,$table_left,$table_top,$all_width,$all_height,$table_title,$unit)
块数也是通过外部的数组决定的
$T_N = count($stat_array)+1;
$num =max($T_N,1);//决定应该生成的块数

也不能怪你看得不仔细；主要是我注释没写；不好意思；我补上吧

确实有重叠哦，看看是怎么回事哦
封装一下比较好。比较同意楼上的楼上的看法。

只能在IE下用啊，chrome就只剩标题和数据了

楼主，看下fushionCharts吧，功能更强大　。

现在大多数图形报表控件都是用javascript开发，比较有名的有三个：FusionCharts，AmCharts，HighCharts，数据源都支持json，支持常见的各种图形报表。
其中Fusion和AmCharts还分别提供了Flash和JS版本。
出于减轻服务器鸭梨考虑，我觉得报表最好还是用前端实现。不要用php……


来自  http://bbs.blueidea.com/thread-2856487-1-1.html

普通分类: 
php
Powered by Drupal

友情链接

校园好文网

 www.shipingzhong.cn  个人技术网_前端_后台    备案号:苏ICP备18010659号-2