Flex: Customize line Series DataTips

Here is what I wanted to do. I wanted to have a flex linechart with the following options

1) Custom data tip
2) Always show data points
3) Change the color of data points based on my data ( like Red, Blue, Green )

1) Custom data tip: This was the easiest option, just call dataTipFunction, which will return a string.You can control the text and its color in the function. When some thing fails, I show my message in Red.

2) Alwasy show data points: For this I used mx.charts.renderers.CircleItemRenderer, so all my datapoints appear. You can control the size using radius property. More than 1 renderer is available, like diamond,box etc

3) Change the color of data points: I used fillFunction to control the color of data points.


<mx:LineChart id="linechart" width="100%" height="100%"                               
                                dataTipFunction="CustomToolTip" dataTipMode="multiple"
                                showDataTips="true" >       

                      <mx:verticalAxis>
                          <mx:LinearAxis baseAtZero="false" title="Total Minutes"/>
                      </mx:verticalAxis>
                     
                      <mx:horizontalAxis>
                          <mx:CategoryAxis categoryField="Run_Date"
displayName="Run Date"  title="Run Date"/>
                      </mx:horizontalAxis>    
                                           
                      <mx:series>
                          <mx:LineSeries id="lineseries" displayName="TotalMinutes"
form="segment" yField="Total_Minutes" radius="6"                                        
                                         itemRenderer="mx.charts.renderers.CircleItemRenderer"
                                         fillFunction="{fill_color}">                                                       
                          </mx:LineSeries>                              
                      </mx:series>
                     
                  </mx:LineChart>

public function fill_color (element:ChartItem, index:Number):IFill
            {               
                if (element.item.Job_Status.search("success")>0)
                    return new SolidColor(0XFF00 ,1);//green
                else if (element.item.Job_Status.search("error")>0)
                    return new SolidColor(0xFF0000 ,1);        //red           
                else
                    return new SolidColor(0x66ff ,1);
            }

private function CustomToolTip(hd:HitData):String
{
    var sJobStatus:String;
    if (hd.item.Job_Status.search("success")>0)
        sJobStatus = "<FONT COLOR='#339966'>" + hd.item.Job_Status + "</FONT>";     //green
    else if (hd.item.Job_Status.search("error")>0)
        sJobStatus = "<FONT COLOR='#FF0000'>" + hd.item.Job_Status + "</FONT>"; //red
    else
        sJobStatus = "<FONT COLOR='#117adc'>" + hd.item.Job_Status + "</FONT>"; //blue
   
    return "Job Status: <b>"+sJobStatus+"</b>";
}