2014-04-24 2 views
0

ONLY Flash AS3을 사용하여 파이 차트를 만들고 싶습니다. 분할 된 원을 그리는 코드를 만들었으므로 다른 부분을 나타내는 데 사용할 수 있습니다.동적 인 그림 그리기, 색상으로 채우기 (AS3)

내 문제 : 원하는만큼 파이를 만드는 코드가 있지만 코드를 색으로 채워야합니다.

/** 
* Draw a segment of a circle 
* @param target <Sprite> The object we want to draw into 
* @param x   <Number> The x-coordinate of the origin of the segment 
* @param y   <Number> The y-coordinate of the origin of the segment 
* @param r   <Number> The radius of the segment 
* @param aStart <Number> The starting angle (degrees) of the segment (0 = East) 
* @param aEnd  <Number> The ending angle (degrees) of the segment (0 = East) 
* @param step  <Number=1> The number of degrees between each point on the segment's circumference 
*/ 
function drawSegment(target:Sprite, x:Number, y:Number, r:Number, aStart:Number, aEnd:Number, step:Number = 1):void { 
     // More efficient to work in radians 
     var degreesPerRadian:Number = Math.PI/180; 
     aStart *= degreesPerRadian; 
     aEnd *= degreesPerRadian; 
     step *= degreesPerRadian; 

     // Draw the segment 
     target.graphics.moveTo(x, y); 
     for (var theta:Number = aStart; theta < aEnd; theta += Math.min(step, aEnd - theta)) { 
      target.graphics.lineTo(x + r * Math.cos(theta), y + r * Math.sin(theta)); 
     } 
     target.graphics.lineTo(x + r * Math.cos(aEnd), y + r * Math.sin(aEnd)); 
     target.graphics.lineTo(x, y); 
}; 

graphics.lineStyle(2,0x000000) 
drawSegment(this,100,100,100,0,130,3); 
drawSegment(this,100,100,100,130,200,3); 
drawSegment(this,100,100,100,200,360,3); 

답변

1

그것은 꽤 쉽게 :

내 코드는 다음 (등 세그먼트 1 블루, 세그먼트 2 빨간색을 만들). 제공된 색상을 사용하여 drawSegment 기능에 beginFill()endFill() 통화를 추가하십시오. 물론 매개 변수를 추가하십시오.

function drawSegment(target:Sprite, x:Number, y:Number, r:Number, aStart:Number, aEnd:Number, color:uint=0x0, step:Number = 1):void { 
     // More efficient to work in radians 
     var degreesPerRadian:Number = Math.PI/180; 
     aStart *= degreesPerRadian; 
     aEnd *= degreesPerRadian; 
     step *= degreesPerRadian; 

     // Draw the segment 
     target.graphics.beginFill(color,1); // second parameter is alpha 
     target.graphics.moveTo(x, y); 
     for (var theta:Number = aStart; theta < aEnd; theta += Math.min(step, aEnd - theta)) { 
      target.graphics.lineTo(x + r * Math.cos(theta), y + r * Math.sin(theta)); 
     } 
     target.graphics.lineTo(x + r * Math.cos(aEnd), y + r * Math.sin(aEnd)); 
     target.graphics.lineTo(x, y); 
     target.graphics.endFill(); 
}; 

사실, 당신은 공통의 중앙 위치, 반경, 타원 속성, 선 스타일을해야합니다 그래서 결국,이 함수의 밖으로 "는, PieChart"수업을해야하고, Shape 또한 자체 그릴 대신에 어딘가에 그려주는 함수를 사용하는 대신에. public class PieChart extends Sprite {...}라고 말하고 this.graphics을 그립니다.