Column Chart Item roll out Event : Column Chart Event « Chart « Flex

Home
Flex
1.Chart
2.Components
3.Container
4.Data Model
5.Development
6.Effects
7.Event
8.Graphics
9.Grid
10.Style
Flex » Chart » Column Chart EventScreenshots 
Column Chart Item roll out Event
Column Chart Item roll out Event
           
<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="initApp()">

  <mx:Script>
    
    import mx.collections.ArrayCollection;
    import mx.charts.events.ChartItemEvent;

    [Bindable]
    private var productSales:ArrayCollection;
    [Bindable]
    private var logData:String;
        
    public function myListener(e:ChartItemEvent):void {
      logData = "Event: " + e.type + 
                "\n PC: " + e.hitData.item.PC 
                +"\n Mac: " + e.hitData.item.Mac + 
                "\n Gadgets: " + e.hitData.item.Gadgets;
      eventLog.verticalScrollPosition=eventLog.verticalScrollPosition+100;
    }

    private function initApp():void {
      productSales = new ArrayCollection( [
            Quarter: "1", PC: 10000, Mac: 3000, Gadgets: 1000, Total: 14000 },
            Quarter: "2", PC: 12000, Mac: 4000, Gadgets: 2000, Total: 18000 },
            Quarter: "3", PC: 15000, Mac: 8000, Gadgets: 5000, Total: 28000 },
            Quarter: "4", PC: 20000, Mac: 10000, Gadgets: 9000, Total: 39000 }
            ]);
      
      
      columnChart.addEventListener(ChartItemEvent.ITEM_ROLL_OUT,myListener);
    }
  
  </mx:Script>

  <mx:Panel title="ColumnChart Event" width="700" height="400" layout="horizontal">
    
    <mx:ColumnChart id="columnChart" height="100%" width="100%" showDataTips="true" dataProvider="{productSales}" doubleClickEnabled="true">            
      <mx:horizontalAxis>
        <mx:CategoryAxis categoryField="Quarter"/>
      </mx:horizontalAxis>              
      <mx:series>
        <mx:ColumnSeries xField="Quarter" yField="PC" displayName="PC"/>
        <mx:ColumnSeries xField="Quarter" yField="Mac" displayName="Mac"/>
        <mx:ColumnSeries xField="Quarter" yField="Gadgets" displayName="Gadgets"/>
      </mx:series>
    </mx:ColumnChart>
    <mx:Legend dataProvider="{columnChart}"/>
    <mx:TextArea id="eventLog" text="{logData}" width="300" height="100%"/>
  </mx:Panel>
</mx:Application>

   
    
    
    
    
    
    
    
    
    
    
  
Related examples in the same category
1.Column Chart Item click EventColumn Chart Item click Event
2.Column Chart Item double click EventColumn Chart Item double click Event
3.Column Chart Item mouse down EventColumn Chart Item mouse down Event
4.Column Chart Item mouse move EventColumn Chart Item mouse move Event
5.Column Chart Item mouse up EventColumn Chart Item mouse up Event
6.Column Chart Item roll over EventColumn Chart Item roll over Event
7.Chart double click eventChart double click event
8.Chart single Click eventChart single Click event
ww_w_.___j__a___va__2s__.___co__m__ | Contact Us
Copyright 2009 - 12 Demo Source and Support. All rights reserved.
All other trademarks are property of their respective owners.