Adobe Flex multi stacked bar chart

We had a requirement in our project to show multi stacked bar chart and I found that it is not a out of box component that we can achieve using Flex charting components.
After a little bit of research and learning, I found that this can be done using the following code:

<mx:ColumnChart id="revBySetChart1" showDataTips="true" width="100%" 
 dataProvider="{dataCollection}"
 dataTipFunction="formattingMethod"
 height="380" paddingLeft="0">

 <mx:verticalAxis>
 <mx:LinearAxis title="verticalAxisTitle" labelFunction="defineVerticalLabel" />
 </mx:verticalAxis>            

 <mx:horizontalAxis>
 <mx:CategoryAxis id="horizontalCategoryId" categoryField="categoryFieldName" />
 </mx:horizontalAxis>    

 <mx:series>
 <chart:ColumnSet type="clustered">
     <chart:ColumnSet type="stacked" displayName="displayName1">
  <mx:ColumnSeries yField="yfield11" displayName="columndisplayname1" styleName="mySeries1"/> 
  <mx:ColumnSeries yField="yfield12" displayName="columndisplayname2" styleName="mySeries2"/> 
     </chart:ColumnSet>     
     <chart:ColumnSet type="stacked" displayName="displayName2" >
  <mx:ColumnSeries yField="yfield21" displayName="columndisplayname1" styleName="mySeries1"/> 
  <mx:ColumnSeries yField="yfield22" displayName="columndisplayname2"  styleName="mySeries2" tabIndex="1"/> 
    </chart:ColumnSet>
 </chart:ColumnSet>
 </mx:series>
</mx:ColumnChart> 

 
Here, displayName1 and displayName2 are stacked bars.
These are in turn placed inside a clustered series to achieve the multi stacked bar graph.

In Adobe Flex, a most discussed limitation is that the Datagrid or AdvancedDataGrid components do not support a footer row for showing some aggregate functions.

A popular and simple solution for this is to create a secondary datagrid whose dataProvider is a aggregate collection of the master datagrid data.

But we need to handle certain properties for footer datagrid to achieve this. some of them are :

1) on stretch of the master datagrid columns, we need to change the column width of the footer datagrid also.

eg: we can write a columnStretchHandler and assign this method to the "columnStretch" property of the master datagrid as follows:

private function columnStretchHandler(event:AdvancedDataGridEvent):void {

  var dg:AdvancedDataGrid = event.target as AdvancedDataGrid;

  <footer_datagrid_id>.columns[event.columnIndex].width = 
   
        dg.columns[event.columnIndex].width; 

}

2) Other properties that may have to be set are :
rowCount="1"
showHeaders="false"
maxHeight="30"
sortExpertMode="true"
sortableColumns="false"