Flex : LineSeries에서 사용자 정의 획 작성?

Question

쉽게이 같은 라인 시리즈에 뇌졸중을 설정할 수 있습니다

이

<mx:LineSeries yField="apple"> 
    <mx:lineStroke> 
     <mx:Stroke 
        color="0x6699FF" 
        weight="4" 
        alpha=".8" 
     /> 
    </mx:lineStroke> 
</mx:LineSeries> 

이 0.8

에 전체 스트로크 알파를 설정합니다하지만 난에 다른 알파를 설정할 수 있도록하려면 dataProvider의 내용을 기반으로 각 플롯을 표시합니다.

예를 들어 라인 시리즈의 yField은 "Apple"입니다.이 라인은 "lineSeries"를 어디에 배치 할지를 알려줍니다. alphaField 같은 것을 추가하여 각 플롯에 대해 획 알파를 설정하는 방법을 알려주고 싶습니다.

<result month="Jan-04"> 
    <apple>81768</apple> 
    <alpha>1</alpha> 
</result> 
<result month="Feb-04"> 
    <apple>51156</apple> 
    <alpha>1</alpha> 
</result> 
<result month="Mar-04"> 
    <apple>51156</apple> 
    <alpha>.5</alpha> 
</result> 

그리고 그때 나는 2

을 음모 한 음모 음모 0에서 고체 뇌졸중, 플롯 1 다음 50 % 알파 스트로크를 할 것이다 alphaField="alpha"을 설정

제의 dataProvider이었다 그렇다면

어떻게하면 되나요? ??? LineSeries의 commitProperties() 및 updateDisplayList() 메서드를 찾고 있는데이 기능을 추가/변경해야 할 필요가 전혀 없습니다.

저는이 클래스가 각 플롯을 그리기 위해 Graphics.lineTo()를 사용해야하므로 기본적으로 현재 alphaField 값을 "가져 오는"것이 필요하고 올바른 Graphics.lineStyle()을 적용해야합니다. 각 줄을 그리기 전에 알파.

감사합니다.

---

UPDATE는

나는 내 대답에 더 가까이 입수했습니다. I는 LineRenderer 연장하면

I가 GraphicsUtilities.drawPolyLine 호출하는)은 updateDisplayList을 (오버라이드()

I가 GraphicsUtilities 확장하고 라인을 묘화하는 곳이므로() 메소드 drawPolyLine을 대체.

가

내가 여기에을 lineStyle()를 호출하고 라인의 알파를 변경할 수 있습니다 ...

이

나는 여전히 내가 drawPolyLine() 메소드 내에서, 알아낼 수 없습니다 1 일이 어떻게 데이터에 대한 액세스 할 수 알파가 있어야하는 것을 지시하는 것은 무엇입니까?

감사합니다 !!!!

Answer 1

Flex SDK 4.0을 사용했지만 3.4 버전에서도 작동 할 것입니다.

tsimus가 아니기 때문에 XML 대신 ArrayCollection을 사용했습니다.

<mx:Application 
    xmlns:fx="http://ns.adobe.com/mxml/2009" 
    xmlns:mx="library://ns.adobe.com/flex/halo" > 

    <fx:Script><![CDATA[ 
     import mx.charts.ChartItem; 
     import mx.charts.renderers.CircleItemRenderer; 
     import mx.collections.ArrayCollection; 
     import mx.graphics.IFill; 
     import mx.graphics.SolidColor; 
     import mx.graphics.Stroke; 

     import st.model.ViewModelLocator; 

     [Bindable] 
     private var modelLocator:st.model.ViewModelLocator = ViewModelLocator.getInstance() ; 

     [Bindable] 
     public var dp :ArrayCollection = new ArrayCollection([ 
      { test:0.1,alpha: 1 }, 
      { test:0.2,alpha: 0.5 }, 
      { test:0.3,alpha: 0.75 }, 
      { test:0.4,alpha: 0.25 }, 
      { test:0.5,alpha: 0.5 } 
     ]); 

     private function myFillFunction(element:ChartItem, index:Number):IFill { 
      return new SolidColor(0x6699FF,Number(element.item.alpha)); 
     } 
    ]]></fx:Script> 

    <mx:ColumnChart id="myChart" dataProvider="{dp}"> 
     <mx:series> 
      <mx:LineSeries lineStroke="{new Stroke(0x6699FF,4,0.1)}" width="100" height="100" yField="test" fillFunction="{myFillFunction}" itemRenderer="{new ClassFactory(mx.charts.renderers.CircleItemRenderer)}" /> 
     </mx:series> 
    </mx:ColumnChart> 

</mx:Application> 

Answer 2

맞춤 아이템 렌더러를 사용해 보았습니까?

<mx:LineSeries> 
    <mx:itemRenderer> 
    <mx:Component> 
     <mx:BoxItemRenderer scaleX="1" scaleY="1" alpha="{data.alpha}"/> 
    </mx:Component> 
    </mx:itemRenderer> 
</mx:LineSeries> 

이것은 간단한 예일 뿐이지 만 itemRenderer가 최선의 방법이라고 생각합니다.

Answer 3

drawPolyLine에서 기능은 pts:Array입니다. 이것은 특정 SeriesItem의 배열입니다. 라인 시리즈의 경우 LineSeriesItem 개의 배열이 있습니다. 따라서 y 축 값 x &을 얻고 싶다면. xValue 또는 yValue 속성 인 LineSeriesItem에 액세스하면됩니다. 이 같은 : pts[0].xValue 또는 pts[0].yValue

---

public static function drawPolyLine(g:Graphics, pts:Array, 
            start:int, end:int, 
            hProp:String, vProp:String, 
            stroke:IStroke, form:Object, 
            moveToStart:Boolean = true):void