Solved

How to populate XML Data in Flex Pie Charts

Posted on 2011-02-23
4
964 Views
Last Modified: 2012-05-11
Hi,
    I need to populate a pie chart component with XML data in Flex....I just want to show high cost and low cost in the first stage and then drill down to the the leaf nodes...I have attached the code below....


Thanks In Advance....


 
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:

	

private function handlegetBranchDetailsResult(event:ResultEvent):void
		{
			acDetails = new XML();
			acDetails = null;
			acDetails = event.result as XML;
			argumentList = XMLList(acDetails.root);
			Alert.show("Data Received");
		}
			
		private function handlegetBranchDetailsFault(event:FaultEvent):void
		{
			Alert.show("in handle get Branch Details Fault : "+event.fault.faultString+" ");
		}
		
	]]>
</mx:Script>


	<mx:TitleWindow height="730" width="100%" layout="absolute">
	<mx:HDividedBox x="5" y="10" width="100%">
		<mx:VBox width="50%" horizontalAlign="center" verticalAlign="middle">
			<mx:Label text="Total Deposits:"/>
			<mx:PieChart id="pcDepostis0" showDataTips="true" dataProvider="{argumentList}" width="100%" x="10" y="37">
				<mx:series>
					<mx:PieSeries displayName="Name" field="Totamt" labelPosition="callout"/>
				</mx:series>
			</mx:PieChart>
			<mx:HBox>
				<mx:Label text="Low Cost:"/>
				<mx:Label text="--"/>
				<mx:Label text="%"/>
			</mx:HBox>
			<mx:HBox>
				<mx:Label text="High Cost:"/>
				<mx:Label text="--"/>
				<mx:Label text="%"/>
			</mx:HBox>
			<mx:Legend dataProvider="{pcDepostis0}" color="#ffffff"/>

			<mx:Spacer/>
		</mx:VBox>
		<mx:VBox width="50%" horizontalAlign="center" verticalAlign="middle">
			<mx:Label text="Total Advances:"/>
			<mx:PieChart id="advDepostis" width="100%">
				<mx:series>
					<mx:PieSeries displayName="Series 1" field=""/>
				</mx:series>
			</mx:PieChart>			
		</mx:VBox>
		</mx:HDividedBox>
		<mx:ControlBar height="54">
			<mx:Spacer width="100%"/>
			<mx:Button label="EXIT" width="80" click="btnCancelClicked()"/>
		</mx:ControlBar>
	</mx:TitleWindow>
</mx:Module>

Open in new window


     

The XML File....


 
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:

	

private function handlegetBranchDetailsResult(event:ResultEvent):void
		{
			acDetails = new XML();
			acDetails = null;
			acDetails = event.result as XML;
			argumentList = XMLList(acDetails.root);
			Alert.show("Data Received");
		}
			
		private function handlegetBranchDetailsFault(event:FaultEvent):void
		{
			Alert.show("in handle get Branch Details Fault : "+event.fault.faultString+" ");
		}
		
	]]>
</mx:Script>


	<mx:TitleWindow height="730" width="100%" layout="absolute">
	<mx:HDividedBox x="5" y="10" width="100%">
		<mx:VBox width="50%" horizontalAlign="center" verticalAlign="middle">
			<mx:Label text="Total Deposits:"/>
			<mx:PieChart id="pcDepostis0" showDataTips="true" dataProvider="{argumentList}" width="100%" x="10" y="37">
				<mx:series>
					<mx:PieSeries displayName="Name" field="Totamt" labelPosition="callout"/>
				</mx:series>
			</mx:PieChart>
			<mx:HBox>
				<mx:Label text="Low Cost:"/>
				<mx:Label text="--"/>
				<mx:Label text="%"/>
			</mx:HBox>
			<mx:HBox>
				<mx:Label text="High Cost:"/>
				<mx:Label text="--"/>
				<mx:Label text="%"/>
			</mx:HBox>
			<mx:Legend dataProvider="{pcDepostis0}" color="#ffffff"/>

			<mx:Spacer/>
		</mx:VBox>
		<mx:VBox width="50%" horizontalAlign="center" verticalAlign="middle">
			<mx:Label text="Total Advances:"/>
			<mx:PieChart id="advDepostis" width="100%">
				<mx:series>
					<mx:PieSeries displayName="Series 1" field=""/>
				</mx:series>
			</mx:PieChart>			
		</mx:VBox>
		</mx:HDividedBox>
		<mx:ControlBar height="54">
			<mx:Spacer width="100%"/>
			<mx:Button label="EXIT" width="80" click="btnCancelClicked()"/>
		</mx:ControlBar>
	</mx:TitleWindow>
</mx:Module>

Open in new window




Do I need to use the XML as XML itself or as XML List....
<?xml version="1.0" encoding="UTF-8"?>
<root>
<LowCost Name="Low Cost" Totamt="378255439.64000005">
<Savings Name="Savings" Totamt="315606393.47"/>
<RoSavings Name="NRO Savings" Totamt="869313.80"/>
<Current Name="Current" Totamt="35627467.37"/>
<ReSavings Name="NRE Savings" Totamt="23602298.18"/>
<Crod Name="CROD" Totamt="2549966.82"/>
</LowCost>
<HighCost Name="High Cost" Totamt="560904429.25">
<Fdr Name="FDR" Totamt="9160151.70"/>
<Qirp Name="QIRP" Totamt="28609765.00"/>
<Mip Name="MIP" Totamt="1461211.20"/>
<Std Name="STD" Totamt="0.00"/>
<Rd Name="RD" Totamt="5642603.40"/>
<Rap30 Name="RAP 30" Totamt="3014440.00"/>
<Rap90 Name="RAP 90" Totamt="173740227.00"/>
<Rap Name="RAP" Totamt="0.00"/>
<Fdr365 Name="FDR 365" Totamt="336095018.95"/>
<Nrefdr Name="NRE FDR" Totamt="50024.00"/>
<Nreqrp Name="NRE QRP" Totamt="3130988.00"/>
<Nremip Name="NRE MIP" Totamt="0.00"/>
<Nrerd Name="NRE RD" Totamt="0.00"/>
<Nrerap Name="NRE RAP" Totamt="0.00"/>
<Nrofdr Name="NRO FDR" Totamt="0.00"/>
<Nroqrp Name="NRO QRP" Totamt="0.00"/>
<Nromip Name="NRO MIP" Totamt="0.00"/>
<Nrord Name="NRO RD" Totamt="0.00"/>
<Nrorap Name="NRO RAP" Totamt="0.00"/>
</HighCost>
</root>

Open in new window

0
Comment
Question by:CCBRONET
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 29

Accepted Solution

by:
dgofman earned 500 total points
ID: 35134682
Use XMLLIst Collection you can also include labelFunction or format/group values

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
                     xmlns:s="library://ns.adobe.com/flex/spark"
                     xmlns:mx="library://ns.adobe.com/flex/mx">
      <s:layout>
            <s:HorizontalLayout/>
      </s:layout>
      <fx:Declarations>
      <mx:XMLListCollection id="dp">
            <mx:source>
                  <fx:XMLList>
                        <LowCost Name="Low Cost" Totamt="378255439.64000005">
                              <Savings Name="Savings" Totamt="315606393.47"/>
                              <RoSavings Name="NRO Savings" Totamt="869313.80"/>
                              <Current Name="Current" Totamt="35627467.37"/>
                              <ReSavings Name="NRE Savings" Totamt="23602298.18"/>
                              <Crod Name="CROD" Totamt="2549966.82"/>
                        </LowCost>
                        <HighCost Name="High Cost" Totamt="560904429.25">
                              <Fdr Name="FDR" Totamt="9160151.70"/>
                              <Qirp Name="QIRP" Totamt="28609765.00"/>
                              <Mip Name="MIP" Totamt="1461211.20"/>
                              <Std Name="STD" Totamt="0.00"/>
                              <Rd Name="RD" Totamt="5642603.40"/>
                              <Rap30 Name="RAP 30" Totamt="3014440.00"/>
                              <Rap90 Name="RAP 90" Totamt="173740227.00"/>
                              <Rap Name="RAP" Totamt="0.00"/>
                              <Fdr365 Name="FDR 365" Totamt="336095018.95"/>
                              <Nrefdr Name="NRE FDR" Totamt="50024.00"/>
                              <Nreqrp Name="NRE QRP" Totamt="3130988.00"/>
                              <Nremip Name="NRE MIP" Totamt="0.00"/>
                              <Nrerd Name="NRE RD" Totamt="0.00"/>
                              <Nrerap Name="NRE RAP" Totamt="0.00"/>
                              <Nrofdr Name="NRO FDR" Totamt="0.00"/>
                              <Nroqrp Name="NRO QRP" Totamt="0.00"/>
                              <Nromip Name="NRO MIP" Totamt="0.00"/>
                              <Nrord Name="NRO RD" Totamt="0.00"/>
                              <Nrorap Name="NRO RAP" Totamt="0.00"/>
                        </HighCost>
                  </fx:XMLList>
            </mx:source>
      </mx:XMLListCollection>
      </fx:Declarations>
      <mx:PieChart id="pieChart"
                         dataProvider="{dp}"
                         showDataTips="true"  >
            <mx:series>
                  <mx:PieSeries id="pieSeries"
                                      field="@Totamt"
                                      nameField="@Name"
                                      labelPosition="inside" > 
                        
                        
                  </mx:PieSeries>
            </mx:series>
      </mx:PieChart>
</s:Application>
0
 
LVL 29

Expert Comment

by:dgofman
ID: 35158356
The question close after 4 days when I gave my answer. And this answer is correct.
Please can you add points to my account?
Thanks,
David
0

Featured Post

How our DevOps Teams Maximize Uptime

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us. Read the use case whitepaper.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

This article was originally published on Monitis Blog, you can check it here . Today it’s fairly well known that high-performing websites and applications bring in more visitors, higher SEO, and ultimately more sales. By the same token, downtime…
Although a lot of people devote their energy toward marketing for specific industries, there are some basic principles that can be applied to any sector imaginable. We’ll look at four steps to take and examine how those steps were put into action fo…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The goal of the tutorial is to teach the user how to select the video input device. Make sure you have an input device that in connected and work and recognized by Adobe Flash Media Live Encoder and select it in the “video input” menu.

738 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question