Question

我已经研究过使用GroupingCollections和AdvancedDataGrids对XML数据进行分组，但我无法弄清楚如何在图表中显示这些数据。

基本上，我想要做的是按类别字段对数据进行分组，这应该给我两行红色，一行蓝色，一个绿色。将这些数据输入饼图时，它应占用适当的空间（红色为1/2，蓝色和绿色为1/4）。我不需要other_data字段，因为我想使用组名（在本例中为类别）作为标注。

有什么建议吗？

示例数据：

<row>
  <category>red</category>
  <other_data>this shouldn't really matter</other_data>
</row>
<row>
  <category>blue</category>
  <other_data>this shouldn't really matter</other_data>
</row>
<row>
  <category>red</category>
  <other_data>this shouldn't really matter</other_data>
</row>
<row>
  <category>green</category>
  <other_data>this shouldn't really matter</other_data>
</row>

Answer 1

我会开枪。可能有一种更优雅的方式，或一些效率，但......

将XML转换为对象的ArrayCollection

{category：“red”，other_data：“无关紧要”} 。。

从那里......

var categoryGroup:GroupingCollection=new GroupingCollection();
categoryGroup.source=ac; // you're ArrayCollection

var grouping:Grouping=new Grouping();
var groupingField:GroupingField=new GroupingField("category");
grouping.fields=[groupingField];

categoryGroup.grouping=grouping;
categoryGroup.refresh();

var categoryAC:ArrayCollection=categoryGroup.getRoot() as ArrayCollection;

chart.dataProvider=categoryAC;

除此之外，你必须在图表上做一些魔术......

<mx:PieChart id="chart" height="100%" width="100%">
    <mx:series>
        <mx:PieSeries dataFunction="myDataFunction" labelFunction="myLabelFunction" labelPosition="callout"/>
    </mx:series>
</mx:PieChart>

你是图表函数处理程序

public function myDataFunction(series:Series, item:Object, fieldName:String):Object
{
    return (item.children.length);
}

public function myLabelFunction(data:Object, field:String, index:Number, percentValue:Number):String
{
    return data.GroupLabel;
}

这可能有点太重了，但它可以解决问题，并且可以在某种程度上扩展到其他场景。

如何在Flex饼图中显示分组的XML数据？

1 个答案: