0 Replies Latest reply on May 28, 2009 2:25 AM by juniorJaffa

    pie chart - drill down/up with HierarchicalCollectionView

    juniorJaffa

      y'ello,

       

      I started to build really simple pie chart with drill down data feature. I decided to use hierarchicalCollectionView, to access children even parent of clicked item, but one problem I realized right now is that pie chart displays only data type ArrayCollection, and hierarchicalVollectionView and method openNode() can be used only Array data type, so when I debugged I realized that can not use openNode(hitData.item)  wih ArrayCollection data type b'cuz flash player pop-ups error window.

      Please, chcek short source code. I thought I can make hierarchy from ArrayCollection but can not use openNode() method that next I need this method later access parent or children. Simply when I click on one wedge, drill down, again, when I click, again drill down...when I click Ctrl+click get one level back then again and again....plese help me gurues

      Code:

       

      <?xml version="1.0" encoding="utf-8"?>
      <mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="vertical">
          <mx:Script>
              <![CDATA[
                  import mx.collections.ArrayCollection;
                  import mx.charts.HitData;
                  import mx.charts.events.ChartItemEvent;
                  import mx.collections.HierarchicalData;
                  import mx.collections.HierarchicalCollectionView;
                 
                  [Bindable]
                  public var cars:ArrayCollection = new ArrayCollection([
                      {type:"BMW", t_count: 150, children:[
                          {type:"1 class", t_count: 18, children:[
                              {type:"Coupe", t_count: 34},
                              {type:"Touring", t_count: 42},
                              {type:"Compact", t_count: 8}
                          ]},
                          {type:"3 class", t_count: 14, children:[
                              {type:"Kabriolet", t_count: 12},
                              {type:"Coupe", t_count: 34},
                              {type:"Touring", t_count: 42},
                              {type:"Compact", t_count: 8}
                          ]},
                          {type:"5 class", t_count: 7, children:[
                              {type:"Kabriolet", t_count: 12},
                              {type:"Coupe", t_count: 34},
                              {type:"Touring", t_count: 42},
                              {type:"Sedan", t_count: 8}
                          ]},
                          {type:"6 class", t_count: 15, children:[
                              {type:"Kabriolet", t_count: 12},
                              {type:"Coupe", t_count: 34},
                          ]},
                          {type:"7 class", t_count: 8, children:[
                              {type:"Kabriolet", t_count: 12},
                              {type:"Coupe", t_count: 34}
                          ]},
                          {type:"X3 class", t_count: 22, children:[
                              {type:"Sedan", t_count: 11},
                              {type:"Coupe", t_count: 9},
                              {type:"Touring", t_count: 5},
                              {type:"Compact", t_count: 17}
                          ]},
                          {type:"X5 class", t_count: 9, children:[
                              {type:"Sedan", t_count: 33},
                              {type:"Coupe", t_count: 18},
                              {type:"Hatchback", t_count: 7}
                          ]},
                          {type:"X6 class", t_count: 11, children:[
                              {type:"Coupe", t_count: 18},
                              {type:"Combi", t_count: 31},
                              {type:"Hatchback", t_count: 8}
                          ]}
                      ]},
                      {type:"Mercedes", t_count: 120, children:[
                          {type:"A class", t_count: 5},
                          {type:"B class", t_count: 12},
                          {type:"CLS class", t_count: 18},
                          {type:"CL class", t_count: 23},
                          {type:"C class", t_count: 12},
                          {type:"E class", t_count: 19}
                      ]},
                      {type:"VW", t_count: 320, children:[
                          {type:"Passat", t_count: 10},
                          {type:"Polo", t_count: 25},
                          {type:"Golf", t_count: 45},
                          {type:"Touareg", t_count: 15}
                      ]}
                  ]);
                 
                  //HCV from hierarchical data
                  private var hView:HierarchicalCollectionView = new HierarchicalCollectionView(new HierarchicalData(cars));
                  //event handler
                  private function drillDownUp(event:ChartItemEvent):void{
                     
                      if(event.hitSet && event.hitSet.length){
                          //DRILL UP
                          if(event.ctrlKey){
                              var hitItem:HitData = event.hitSet[0];
                              var parent1:Object = hView.getParentItem(hitItem.item);
                              var parent2:Object = hView.getParentItem(parent1);
                             
                             
                              if(!parent2){
                                  myPieChart.dataProvider = hView.source.getRoot();
                              }
                              else{
                                  myPieChart.dataProvider = hView.getChildren(parent2);
                              }
                          }   
                          //DRILL DOWN
                          else{
                              var hitItem:HitData = event.hitSet[0];
                             
                              if(hitItem.item.hasOwnProperty("children")){
      //                            hView.openNodes(hitItem.item); //here is problem!!
                                  myPieChart.dataProvider = hView.getChildren(hitItem.item);
                              }
                          }
                      }
                  }
              ]]>
          </mx:Script>
         
         
          <mx:Panel title="PieChart DDD Test - Trh predaja automobilov - 2009">
              <mx:PieChart id="myPieChart"
                           dataProvider="{cars}"
                           itemClick="drillDownUp(event)"
                           showDataTips="true">
                  <mx:series>
                      <mx:PieSeries field="t_count"
                                    nameField="type"
                                    labelField="type"
                                    labelPosition="inside"/>
                  </mx:series>
              </mx:PieChart>
              <mx:Legend dataProvider="{myPieChart}" direction="horizontal"/>
          </mx:Panel>
         
      </mx:Application>