2

I'm doing some line charts in my Flex application, and I need to draw segments of those line chart in different color. Does anyone have an idea how this could be achieved? For instance, if I have a code like this (actually, I have given this trivial example for simplicity (the problem is the same)):

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
        <![CDATA[
        import mx.collections.ArrayCollection;
        [Bindable]
        private var profit:ArrayCollection = new ArrayCollection( [
            { Month: "Jan", Profit: 2000 },
            { Month: "Feb", Profit: 1000 },
            { Month: "Mar", Profit: 1500 },
            { Month: "Apr", Profit: 1800 },
            { Month: "May", Profit: 2400 },
            { Month: "Jun", Profit: 3500 } 
            ]);
        ]]>
    </mx:Script>
    <mx:Stroke id = "s1" color="blue" weight="2"/>
        <mx:LineChart id="linechart" dataProvider="{profit}">
            <mx:horizontalAxis>
                <mx:CategoryAxis categoryField="Month"/>
            </mx:horizontalAxis>
            <mx:series>
                <mx:LineSeries yField="Profit" form="curve" displayName="Profit" lineStroke="{s1}"/>
            </mx:series>
        </mx:LineChart>
</mx:Application>

I would like this "Profit" series to be blue (as it currently is), but I would like first segment of the line (Jan, Feb) to be, let's say yellow, and another segment, let's say (Mar, Apr, Jun) to be red.

I know I could draw additional series for these segments with proper coloring on top of existing one, but I was wondering is there a more elegant way of doing this in Flex?

Thanks for you answers.

kevin
  • 2,172
  • 3
  • 18
  • 19

1 Answers1

2

Probably, you can create your own custom line chart series class. This is a demo with sources by Ely Greenfield where custom PieChart series are implemented. See SizedPieSeries.as file. There is a radiusField property which is a custom one. I guess you can do the same with the 'color'.

mico
  • 709
  • 5
  • 18
  • Thanks. This might do the trick. BTW, do you happen to know any good resources that explain in more detail customizing Flex objects in general? – kevin Mar 20 '10 at 11:52
  • 1
    Here is a list of documents I found: UIComponent LifeCycle overview: http://danorlando.com/?p=122 More detailed information: http://livedocs.adobe.com/flex/3/html/help.html?content=ascomponents_advanced_2.html Hope that helps – mico Mar 20 '10 at 16:21
  • Here is one possible solution. I think it can help http://stackoverflow.com/questions/14528652 – Anton Jan 26 '13 at 18:16