遇见一个绘制用户信息统计的扇形图项目,找到我晏哥留的一个方法,贴在这儿备用:
/** * 绘制扇形 * @param mc 承载扇形的对象 * @param x 圆心角x * @param y 圆心角y * @param r 半径 * @param angle 绘制角度 * @param startAngle 起始角度 * @param color 填充颜色 * @param hasFrame 是否填充边框 */ private function drawSector(sp:Sprite,x:Number=0,y:Number=0,r:Number=100,angle:Number=60,startAngle:Number=0,color:Number=0xff0000,hasFrame:Boolean=true):void { sp.graphics.clear(); if(hasFrame) { sp.graphics.lineStyle(0,0xffff00); } sp.graphics.beginFill(color,1); sp.graphics.moveTo(x,y); angle=(Math.abs(angle)>360)?360:angle; var n:Number=Math.ceil(Math.abs(angle)/45); var angleA:Number=angle/n; angleA=angleA*Math.PI/180; startAngle=startAngle*Math.PI/180; sp.graphics.lineTo(x+r*Math.cos(startAngle),y+r*Math.sin(startAngle)); for (var i:int=1; i<=n; i++) { startAngle+=angleA; var angleMid:Number=startAngle-angleA/2; var bx:Number=x+r/Math.cos(angleA/2)*Math.cos(angleMid); var by:Number=y+r/Math.cos(angleA/2)*Math.sin(angleMid); var cx:Number=x+r*Math.cos(startAngle); var cy:Number=y+r*Math.sin(startAngle); sp.graphics.curveTo(bx,by,cx,cy); } if (angle!=360) { sp.graphics.lineTo(x,y); } sp.graphics.endFill(); }
下面是应用代码部分:
var testXML:XML = <percent>
<dataInfo view_percent=" 12%" type_name="APP" type="1" is_has="0"/>
<dataInfo view_percent=" 15%" type_name="微信" type="2" is_has="0"/>
<dataInfo view_percent=" 53%" type_name="横屏" type="3" is_has="0"/>
<dataInfo view_percent=" 9%" type_name="竖屏" type="4" is_has="0"/>
<dataInfo view_percent=" 11%" type_name="PC" type="5" is_has="0"/>
</percent>;
_piechartXML = testXML;
for (var i:int = 0; i < _piechartXML.dataInfo.length(); i++)
{
if(String(_piechartXML.dataInfo[i].@view_percent) != "0%"){
var angle:Number = Number(String(_piechartXML.dataInfo[i].@view_percent).replace("%","")) / 100 * 360;
var startAngle:Number = _angleJilu;
var piechartSP:Sprite = new Sprite();
var color:uint;
if(String(_piechartXML.dataInfo[i].@type_name) == "微信"){
color = 0x9980FF;
}else if(String(_piechartXML.dataInfo[i].@type_name) == "APP"){
color = 0x99FFE6;
}else if(String(_piechartXML.dataInfo[i].@type_name) == "横屏"){
color = 0xFF8080;
}else if(String(_piechartXML.dataInfo[i].@type_name) == "竖屏"){
color = 0xB3FF80;
}else if(String(_piechartXML.dataInfo[i].@type_name) == "PC"){
color = 0xffffff;
}
drawSector(piechartSP,0,0,250,angle,startAngle,color,false);
_sp_con.addChild(piechartSP);
_angleJilu += angle;
}
}