Friday, March 14, 2008

Adding a drop-down button to the OlapDatagrid header

Flex give u the liberty to have different renderers . Well first lets understand how things work ..

Requirements
  • Place PopUpButton [ PivotPopUpButton] as a headerRenderer for OlapDataGrid
  • When the dropdown is selected the dropdown list provides a list of members of the attribute
Explaination

















OlapDataGrid extends form AdvancedDataGrid.
OlapDataGrid when creating headers , will call makelistdata for each header .
Now if u wish to pass some information apart from already available info u need to create a class that extends AdvancedDataGridListData.



For example in our scenario we need a popUpButton which shows members when a dropdown button is pressed . So the information of members should be passed on to the PopUpButton . So what we do is we create a class PivotListData that extends the AdvancedDataGridListData and add two properties namely
  • hasMembers : Boolean
  • members : ArrayCollection
Now we override makelistData of OlapDataGrid so that it returns PivotListData . So that olapDataGrid gives PivotListData to the renderers . In the renderer's set listdata , you have all the info needed . You can find the source code here

When you click the dropdown button of Company , you can see the choices .( Some problem with popup button coz of which u need to click the button twice ).

[PS : that I havent added the code for filtering here .. Soon I ll post a pivot Component in Flex ]












5 comments:

Nancy said...

Hello. Sorry to bother you, but you seem to be the person to ask. I'm trying to create a chart using flex and have a way I think I can do it, but I'm wondering if you may know a quicker/better way to use preexisting components. What I would like is a chart that shows a heirarchial drill down relationship. I can get kinda close using AdvancedDataGrid, but the look and feel doesn't work. I lot of wasted space, and I'm trying to show visually the relationships between parents and children with percentages. Much easier if I show.

http://www.wolffebrothers.com/drillDownRelationShip.jpg

example of the chart

Like I said I can get kinda close, and think there may be a way to use the advanceddatagrid with itemrenders etc. Do you have any idea how I would do this. Also the data would be flat and grouped to show the relationship.

Groupings: Type of Food -- Variety of type -- Varieties of Varieties.

The ADG will put all those groupings in one column which wastes a ton of space.

Satish T J said...

@Nancy :
Kindly look at the latest Post TreeChart and do reply back if it was useful?

Nancy said...

Wow! Big time help. Thank you so much for spending the time.... how long did that take you?

Satish T J said...

Around 2 hrs

Roman said...

Hello.
I think OLAPDataGrid is too slow. We recently integrated a OLAP component developed in pure AS3 from http://www.flexmonster.com and it works much faster.
Thanks