Bar, Pie, Plot Charts


<?xml version="1.0" ?> 
<!--  charts/SimpleSelection.mxml --> 
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
    <mx:Script>
    <![CDATA[ 
        import mx.collections.ArrayCollection;

        private function handleChange(event:Event):void {
            var allSeries:Array = event.currentTarget.series;
            textArea1.text = "";
            for (var i:int=0; i<allSeries.length; i++) {
                textArea1.text += "n" + allSeries[i].id + 
                    " Selected Items: " + allSeries[i].selectedIndices;
            }
        }

        [Bindable]
        public var expenses:ArrayCollection = new ArrayCollection([
            { Expense:"Taxes", Amount:2000 },
            { Expense:"Rent", Amount:1000 },
            { Expense:"Food", Amount:200 } ]);

        [Bindable]
        private var medalsAC:ArrayCollection = new ArrayCollection( [
            { Country: "A", Gold: 35, Silver:39, Bronze: 29 },
            { Country: "B", Gold: 32, Silver:17, Bronze: 14 },
            { Country: "C", Gold: 27, Silver:27, Bronze: 38 },
            { Country: "D", Gold: 15, Silver:15, Bronze: 10 },
            { Country: "E", Gold: 15, Silver:10, Bronze: 10 } ]);

        [Bindable]
        private var profitsAC:ArrayCollection = new ArrayCollection( [
            { Month: "Jan", Profit: 2000, Expenses: 1500, Amount: 450 },
            { Month: "Feb", Profit: 1000, Expenses: 200, Amount: 600 },
            { Month: "Mar", Profit: 1500, Expenses: 500, Amount: 300 },
            { Month: "Apr", Profit: 1800, Expenses: 1200, Amount: 900 },
            { Month: "May", Profit: 2400, Expenses: 575, Amount: 500 } ]);

    ]]> 
    </mx:Script>
    <mx:HBox>
        <mx:Panel title="Bar Chart">
            <mx:BarChart id="myBarChart" 
                height="225" 
                showDataTips="true" 
                dataProvider="{medalsAC}" 
                selectionMode="multiple" 
                change="handleChange(event)"
            >
                <mx:verticalAxis>
                    <mx:CategoryAxis categoryField="Country"/> 
                </mx:verticalAxis>
                <mx:series>
                    <mx:BarSeries id="barSeries1" 
                        yField="Country" 
                        xField="Gold" 
                        displayName="Gold" 
                        selectable="true"
                    /> 
                    <mx:BarSeries id="barSeries2" 
                        yField="Country" 
                        xField="Silver" 
                        displayName="Silver" 
                        selectable="true"
                    /> 
                    <mx:BarSeries id="barSeries3" 
                        yField="Country" 
                        xField="Bronze" 
                        displayName="Bronze" 
                        selectable="true"
                    /> 
                </mx:series>
            </mx:BarChart>
            <mx:Legend dataProvider="{myBarChart}"/> 
        </mx:Panel>

        <mx:Panel title="Pie Chart" >
            <mx:PieChart id="myPieChart" 
                height="225"
                dataProvider="{expenses}" 
                showDataTips="true"
                selectionMode="multiple" 
                change="handleChange(event)"
            >
                <mx:series>
                    <mx:PieSeries                     
                        id="pieSeries1"
                        field="Amount" 
                        nameField="Expense" 
                        labelPosition="callout"
                    />
                </mx:series>
            </mx:PieChart>
            <mx:Legend dataProvider="{myPieChart}"/>
        </mx:Panel>    
        <mx:Panel title="Plot Chart">
            <mx:PlotChart id="myPlotChart" 
                height="225" 
                showDataTips="true" 
                dataProvider="{profitsAC}" 
                selectionMode="multiple" 
                change="handleChange(event)"
            >
                <mx:series>
                    <mx:PlotSeries id="plotSeries1" 
                        xField="Expenses" 
                        yField="Profit" 
                        displayName="Expenses/Profit" 
                        selectable="true"
                    /> 
                    <mx:PlotSeries id="plotSeries2" 
                        xField="Amount" 
                        yField="Expenses" 
                        displayName="Amount/Expenses" 
                        selectable="true"
                    /> 
                    <mx:PlotSeries id="plotSeries3" 
                        xField="Profit" 
                        yField="Amount" 
                        displayName="Profit/Amount" 
                        selectable="true"
                    /> 
                </mx:series>
            </mx:PlotChart>
            <mx:Legend dataProvider="{myPlotChart}"/> 
        </mx:Panel>
    </mx:HBox>
    <mx:HBox width="370" height="71">
        <mx:Label text="Selection Changed Event:" /> 
        <mx:TextArea id="textArea1" height="70" width="213"/> 
    </mx:HBox>
</mx:Application>
Advertisements

~ by mjcprasad2000 on January 16, 2009.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: