Display text with images in flex bar chart axis

Question

I am creating column chart to show friends score statistics in facebook application. My problem is how to display friend names with images in y-axis and their score in x-axis.I cant able to pass any arguments in the method 'setSource' of tag. please see the sample code here. If anybody came to know please give me some idea or samples. Thanks in advance.

 <mx:Application  xmlns:mx="http://www.adobe.com/2006/mxml"
        layout="vertical" width="100%" height="100%">  
      <mx:Script><![CDATA[
    import mx.controls.TextArea;
    import mx.controls.Text;`enter code here`
    import mx.utils.ObjectUtil;
    import mx.controls.Alert;
         import mx.collections.ArrayCollection;
         import mx.charts.series.items.PlotSeriesItem;
         import mx.controls.Label;
         import mx.controls.Image;
         import mx.containers.HBox;
         import mx.charts.series.items.BarSeriesItem;
         import mx.charts.chartClasses.Series;
         import mx.charts.ChartItem;

         [Bindable]
         public var frienddetails:ArrayCollection = new ArrayCollection([                                                 
       {score:"5",Name:"charles",imgSource:"http://graph.facebook.com/10058050960/picture"},
       {score:"9",Name:"Martin",imgSource:"http://graph.facebook.com/100231645808/picture"},
       {score:"7",Name:"stewart",imgSource:"http://graph.facebook.com/10058050960/picture"}]);

    ]]>
    </mx:Script>    


    <mx:BarChart id="bar" height="100%"  
            paddingLeft="15" paddingRight="5" 
            showDataTips="true"  width="847" 
            dataTipMode="multiple"  >
            <mx:verticalAxis>
                <mx:CategoryAxis id="vAxis" categoryField="Name"  dataProvider="{frienddetails}" />
            </mx:verticalAxis>  
            <mx:verticalAxisRenderers>
                <mx:AxisRenderer placement="left" axis="{vAxis}"  >
                    <mx:labelRenderer>
                        <mx:Component>
                            <mx:HBox width="100%" height="100%" minWidth="120" minHeight="20">
                                <mx:Image id="axisImage" height="100%" width="25" source="{setSource()}">
                                    <mx:Script><![CDATA[
                                        import mx.collections.ArrayCollection;
                                        import mx.utils.ObjectUtil;
                                        import mx.controls.Alert;
                                        import mx.charts.chartClasses.Series;
                                        import mx.charts.ChartItem;
                                        import mx.charts.series.items.BarSeriesItem;                                        
                               public function setSource(element : ChartItem, series : Series) : String
                                       {
                                            var data : BarSeriesItem = BarSeriesItem(element);
                                            var imgSrc : String = "";

                                            Alert.show("Check : "+data.item.imgSource);
                                            imgSrc = data.item.imgSource;

                                            return imgSrc;
                                        }  
                                    ]]></mx:Script>
                                </mx:Image>
                                <mx:Label id="axisLabel" fontSize="12" width="100%" height="100%">
                                    <mx:Script><![CDATA[
                                        [Bindable]
                                        override public function set data(value : Object) : void
                                        {
                                            if (value == null)
                                            {
                                                return;
                                            }

                                                axisLabel.text = value.text;

                                        }
                                    ]]>
                                    </mx:Script>
                                </mx:Label>
                            </mx:HBox>
                        </mx:Component>
                    </mx:labelRenderer>
                </mx:AxisRenderer>
            </mx:verticalAxisRenderers>
            <mx:series>
                <mx:BarSeries id="bs2" dataProvider="{frienddetails}" 
                        yField="Name" xField="score" displayName="Score" />          
        </mx:series>
    </mx:BarChart>
</mx:Application>

Answer 1

setSource(element : ChartItem, series : Series)

Before we look at anything else, your function expects 2 arguments: [element] and [series]. Neither are specified in the call. Only [element] is referenced in the function.