Flex штабели ColumnChart не показывая вверх

Question

я иметь следующую структуру XML:

<root> 
    <day name="Sun" values="21,22,25,26"/> 
    <day name="Mon" values="27,20,22,25"/> 
</root> 

Я хочу, чтобы это было представлено в гистограмме с сложенной решеткой. Первый столбец будет состоять из столбцов, расположенных друг над другом со значениями 21, 22, 25 и 26, соответствующими воскресеньям. Длина значений может меняться каждый раз при обновлении датапараудера. Так что я написал код, как:

var columnChart:ColumnChart = new ColumnChart(); 
columnchart.type="stacked"; 
var yAxisData:String = "@values"; 
var xAxisData:String = "@name"; 
var dp:XMLListCollection = new XMLListCollection(xmlFile.day); 
columnchart.dataProvider = dp; 

var valueLength:int = dp[0][yAxisData].toString().split(",").length; 
for(var count:int = 0;count<valueLength;count++){ 
var bSeries:ColumnSeries = new ColumnSeries(); 
bSeries.dataProvider = dataProvider; 
bSeries.xField = xAxisData; 
bSeries.yField = yAxisData+"["+count+"]"; 
columnchart.series.push(bSeries); 
} 
var hAxis:CategoryAxis = new CategoryAxis(); 
hAxis.dataProvider = dp; 
hAxis.categoryField = xAxisData ; 
CartesianChart(columnchart).horizontalAxis = hAxis;  

Но граф выходит пустой. Где я неправ?

Answer 1

Ниже код может помочь вам: -

<?xml version="1.0" encoding="utf-8"?> 
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009" 
       xmlns:s="library://ns.adobe.com/flex/spark" 
       xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600"> 
    <fx:Declarations> 
     <!-- Place non-visual elements (e.g., services, value objects) here --> 
     <fx:XML format="e4x" id="xmlFile"> 
      <root> 
       <day name="Fri" values="11,22,33,44,55,66"/> 
       <day name="Sat" values="10,20,30,40,50,60"/> 
       <day name="Sun" values="21,22,25,26,56,76"/> 
       <day name="Mon" values="5,10,15,20,25,30"/> 
      </root> 
     </fx:XML> 
    </fx:Declarations> 
    <fx:Script> 
     <![CDATA[ 
      import mx.charts.CategoryAxis; 
      import mx.charts.ColumnChart; 
      import mx.charts.Legend; 
      import mx.charts.chartClasses.CartesianChart; 
      import mx.charts.chartClasses.Series; 
      import mx.charts.series.ColumnSeries; 
      import mx.charts.series.ColumnSet; 
      import mx.collections.ArrayCollection; 
      import mx.collections.XMLListCollection; 


      private function createChart():void 
      { 
       var columnChart:ColumnChart = new ColumnChart(); 
       var dp:XMLListCollection = new XMLListCollection(xmlFile.day); 
       var stackedData:ArrayCollection = new ArrayCollection(); 

       var yAxisData:String = "@values"; 
       var xAxisData:String = "@name"; 

       var horizontalCategoryAxis:CategoryAxis = new CategoryAxis(); 
       horizontalCategoryAxis.categoryField = "name"; 
       columnChart.horizontalAxis = horizontalCategoryAxis; 

       var columnSet:ColumnSet = new ColumnSet(); 
       columnSet.type = "stacked"; 

       for(var row:int=0; row < dp.length; row++){ 
        var arrayData:Array = dp[row][yAxisData].toString().split(","); 

        var seriesArray:Array = new Array(); 

        var obj:Object = new Object(); 
        obj.name = dp[row][xAxisData].toString(); 

        for(var j:int=0; j < arrayData.length; j++) 
        { 
         obj["xValues"+j] = arrayData[j].toString(); 
        } 
        stackedData.addItem(obj); 
       } 

       for(var col:int=0; col < arrayData.length; col++){ 
        var colmSeries:ColumnSeries = new ColumnSeries(); 
        colmSeries.yField = "xValues"+col; 
        colmSeries.displayName = "Value at "+col; 
        seriesArray.push(colmSeries); 
       } 

       columnSet.series = seriesArray; 
       columnChart.series = [columnSet]; 

       columnChart.dataProvider = stackedData; 
       columnChart.percentWidth = 70; 
       columnChart.percentHeight = 70; 
       columnChart.showDataTips = true; 

       var legend:Legend = new Legend(); 
       legend.direction = "horizontal"; 
       legend.dataProvider = columnChart; 

       container.addElement(columnChart); 
       container.addElement(legend); 
      } 

     ]]> 
    </fx:Script> 

    <s:VGroup id="container" width="100%" height="100%" creationComplete="createChart()"/> 
</s:Application>