您当前的位置: 首页 » JavaScript/JQuery编程 » 一个JS圆饼例子
一个JS圆饼例子
论坛链接
<!--
Power By dewin
Start-06-08 12:20
Finish 񎧓-06-08 18:30
-->
<html xmlns:v>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
v\:*{behavior:url(#default#VML)}
</style>
<body>
<script>
PieNum = [25,25,30] //圆饼数据
PieColor = ['#ADFF2F','#87CEFA','#FF69B4'] //对应的颜色
PieTitle = ['男性','女性','异形'] //对应的描述
var PieData = []
for(var i=iTotal=0;i<PieNum.length;i++)iTotal += PieNum
for(var i=0;i<PieNum.length;i++)PieData=PieNum/iTotal
var oTop = 10;
var oLeft = 300;
var oWidth = 200;
var oHeight = 200;
var oAngle = 30 //degree
function window.onload(){
oWidth /= 2;
oHeight /= 2;
var endAngle = 0;
var startAngle = oAngle*65536;
var iHtml="<span style='position:absolute;left:"+oLeft+";top:"+oTop+";width:"+oWidth+";height:"+oHeight+"'>";
for(var i=0;i<PieData.length;i++)
iHtml += "<v:shape path='m 1000,1000 ae 1000 1000 1000 1000 "+(startAngle+=endAngle)+" "+(endAngle=parseInt(PieData*65536*360))+" x e ns' fillcolor="+PieColor+" title='"+PieTitle+" : "+Math.round(PieData*10000)/100+"%' style='position:absolute;width:"+oWidth+";height:"+oHeight+";'/>" // ?*360/100 path的ae的角度要*65536。
document.body.innerHTML += iHtml+"</span>";
}
</script>
Power By dewin
Start-06-08 12:20
Finish 񎧓-06-08 18:30
-->
<html xmlns:v>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
v\:*{behavior:url(#default#VML)}
</style>
<body>
<script>
PieNum = [25,25,30] //圆饼数据
PieColor = ['#ADFF2F','#87CEFA','#FF69B4'] //对应的颜色
PieTitle = ['男性','女性','异形'] //对应的描述
var PieData = []
for(var i=iTotal=0;i<PieNum.length;i++)iTotal += PieNum
for(var i=0;i<PieNum.length;i++)PieData=PieNum/iTotal
var oTop = 10;
var oLeft = 300;
var oWidth = 200;
var oHeight = 200;
var oAngle = 30 //degree
function window.onload(){
oWidth /= 2;
oHeight /= 2;
var endAngle = 0;
var startAngle = oAngle*65536;
var iHtml="<span style='position:absolute;left:"+oLeft+";top:"+oTop+";width:"+oWidth+";height:"+oHeight+"'>";
for(var i=0;i<PieData.length;i++)
iHtml += "<v:shape path='m 1000,1000 ae 1000 1000 1000 1000 "+(startAngle+=endAngle)+" "+(endAngle=parseInt(PieData*65536*360))+" x e ns' fillcolor="+PieColor+" title='"+PieTitle+" : "+Math.round(PieData*10000)/100+"%' style='position:absolute;width:"+oWidth+";height:"+oHeight+";'/>" // ?*360/100 path的ae的角度要*65536。
document.body.innerHTML += iHtml+"</span>";
}
</script>