不用任何控件的VML统计图(1)-饼图

来源：互联网发布：青年文摘知乎编辑：程序博客网时间：2024/05/18 00:12

/*未经许可，不得转载！

Email:zcwmxn@sina.com

作者：周长武

<html xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<script language="JavaScript" type="text/javascript">
function Pie(r,item_t,item_v){
  //r半径，item_t项目的标题，item_v项目的值
  var i,s;
  var item_p=new Array(); //各个项目的比例
  var item_q=new Array(); //各个项目的百分比
  var sum=0; //项目总和
  var len=item_t.length; //项目个数
  var d=r*2; //直径
  //定义颜色
  var color1=new Array("#d1ffd1","#ffbbbb","#ffe3bb","#cff4f3","#d9d9e5","#ffc7ab","#ecffb7","#ff0000","#ff0000","#0033ff","#ff9900","#00cc00","#ff99ff","#ff33cc","#66ffcc","#336666","#2E8B57","#D2B48C","#9966FF");
  var color2=new Array("#d1ffd1","#ff0000","#ff9900","#33cccc","#666699","#993300","#99cc00","#FFFFFF","#ff0000","#0033ff","#ff9900","#00cc00","#ff99ff","#ff33cc","#66ffcc","#336666","#2E8B57","#D2B48C","#9966FF");
  for(i=0;i<len;i++)
   sum = sum + parseInt(item_v[i]);
  for(i=0;i<len;i++){
   item_p[i]=item_v[i]/sum;
   item_q[i]=FormatNumber(item_p[i]*100,1)+"%";
  }
  s="<v:group style='width:"+(d+230)+"px;height:"+d+"px' coordsize='"+(d+230)+","+d+"'>";
  //背景
  s+="<v:rect style='left:-5;top:-5;width:"+(d+235)+";height:"+(d+10)+"'>";
  s+="<v:shadow on='t' type='single' color='silver' offset='5px,5px' />";
  s+="</v:rect>";
  //扇形
  var angle1=0;
  var angle2;
  for(i=0;i<len;i++){
   angle2=parseInt(Math.round(360*item_p[i]));
   if(i==len-1) //这样会有误差的！！！！！！！！！！——zcw
    angle2=360-angle1;
   s+="<v:shape title='"+item_t[i]+"："+item_q[i]+"' style='position:relative;width:"+d+";height:"+d+"' coordsize='"+d+","+d+"' strokeweight='1' strokecolor='#fff' fillcolor='"+color1[i]+"' path='m "+r+","+r+" ae "+r+","+r+","+r+","+r+","+65536*angle1+","+65536*angle2+" x e'>";
   s+="<v:fill color2='"+color2[i]+"' rotate='t' focus='100%' type='gradient' />";
   s+="</v:shape>"
   angle1+=angle2;
  }
  //各个项目说明
  s+="<v:group style='position:relative;left:"+(d+25)+";top:"+(d-(22*len+12))+";width:200;height:"+(22*len+4)+"' coordsize='200,"+(22*len+4)+"'>";
  s+="<v:rect style='width:200;height:"+(22*len+4)+"' strokecolor='#333' />";
  for(i=0;i<len;i++){
   s+="<v:rect style='left:4;top:"+(i*22+4)+";width:25;height:18;' title='"+item_t[i]+"："+item_q[i]+"' fillcolor='"+color1[i]+"'><v:fill color2='"+color2[i]+"' rotate='t' focus='100%' type='gradient' /></v:rect>";
   s+="<v:shape style='left:40;top:"+(i*22+4)+";width:200;height:25;white-space:nowrap;text-align : left'>"+item_t[i]+"："+item_v[i]+"("+item_q[i]+")</v:shape>";
  }
  s+="</v:group>";
  s+="</v:group>";
  document.write(s);
}

-->
</style>

</head>

<body>

    //按照大小进行排序
     for(i = 0; i < y.length; i++)
     for(j = i+1; j< y.length; j++){
      if(parseInt(y[i]) <= parseInt(y[j])){
        tempy = y[j];
        y[j] = y[i];
        y[i] = tempy;

        tempx = x[j];
        x[j] = x[i];
        x[i] = tempx;
       }
        }
       //画图，并控制图大小
    Pie(200,x,y);
   </script>

</body>
</html>