Flex：在LineSeries上创建自定义笔划？

您可以轻松地设置一个行程上线系列这样的：Flex：在LineSeries上创建自定义笔划？

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

这将为整个行程设置阿尔法以0.8

但我希望能够设置不同的字母上基于dataProvider中的某些内容为每个plot添加行为。

例如，线条系列中的yField是“Apple”，它是如何知道在哪里绘制线条系列的。我希望能够添加诸如alphaField之类的内容，告诉它如何为每个绘图设置笔画Alpha。

所以如果我的数据提供程序是：

<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>

我设置alphaField="alpha"那么我将不得不从情节0了坚实的中风积1，然后从地块1一50％的α-中风积2

我该怎么做？我正在查看LineSeries的commitProperties（）和updateDisplayList（）方法，不知道需要添加/更改哪些内容才能做到这一点？

我很肯定，这个类必须使用Graphics.lineTo（）来绘制每个图，所以基本上它需要以某种方式“获取”当前的alphaField值，并将Graphics.lineStyle（）与正确的绘制每行之前的alpha。

谢谢！

UPDATE

我已经得到了更接近我的答案。

当我延伸LineRenderer我重写的updateDisplayList（）它调用GraphicsUtilities.drawPolyLine（）

我延伸GraphicsUtilities并重写方法drawPolyLine（），因为这是当线实际上绘制。

我可以在这里调用lineStyle（），并改变线的阿尔法...

我仍然有1件事我想不通，从drawPolyLine（）方法中我怎么能访问数据这决定了alpha应该是什么？

谢谢！

来源

2010-01-15 JD Isaacks

我使用了Flex SDK 4.0，但我相信它也能在3.4上工作。

使用ArrayCollection而不是XML，因为它不是tsimus。

<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>

来源

2010-01-19 15:33:59

谢谢，这改变了关节，我试图改变实际上线。 – 2010-01-19 17:30:57

您是否尝试过使用自定义项目渲染器？

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

这只是一个简单的例子，但我认为itemRenderer是要走的路。

来源

2010-01-19 15:36:01 Thomas

在drawPolyLine功能，你会得到pts:Array。这是特定SeriesItem的数组。对于Line系列，您将获得一组LineSeriesItem对象。所以如果你想得到你的x轴值。您只需访问LineSeriesItem的xValue或yValue财产。像这样：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

来源

2010-01-21 09:58:33 RSTanvir

Flex：在LineSeries上创建自定义笔划？

回答

相关问题