在弹性条形图轴上显示带有图像的文本

发布于 2024-12-02 02:17:11 字数 4636 浏览 2 评论 0原文

我正在创建柱形图来显示 Facebook 应用程序中朋友的分数统计数据。我的问题是如何在 y 轴上显示带有图像的朋友姓名以及在 x 轴上显示他们的分数。我无法在标签的“setSource”方法中传递任何参数。请参阅此处的示例代码。如果有人知道请给我一些想法或样品。提前致谢。

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

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>

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

a√萤火虫的光℡ 2024-12-09 02:17:12

setSource(element : ChartItem, series : Series)

在我们看其他内容之前,您的函数需要 2 个参数:[element] 和 [series]。通话中均未指定。函数中仅引用了 [element]。

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.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文