Ask a Question related to Macromedia Flex General Discussion, Design and Development.
-
kanchunkin@gmail.com #1
Implementing Population pyramid using Flex 2 Charting
Hi,
How can I calculate the width of the gap between the charts in the
following statement so that the bars in chart look like continuous
with 2 colors?
<mx:BarChart id="chart2" height="100%" width="47%" x="{chart1.width -
11}" paddingBottom="30" paddingLeft="0" paddingRight="0"
paddingTop="15" showDataTips="false"
dataProvider="{results.lastResult.data.population} " >
I found that the gap size is different under different resolution like
1024x768, 1440 x 900 etc.
=== code ===
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
creationComplete="init()" horizontalScrollPolicy="off"
verticalScrollPolicy="off" backgroundColor="0xFFFFFF"
layout="absolute" width="100%" height="100%">
<mx:HTTPService id="results" />
<mx:Canvas id="panel" width="100%" height="100%"
horizontalScrollPolicy="off" verticalScrollPolicy="off">
<mx:Script>
<![CDATA[
import mx.charts.series.BarSeries;
import flash.events.EventDispatcher;
[Bindable] private var fontSize:Number = 12;
private function init():void {
GetData("ChartData.aspx");
fontSize = 10;
}
private function GetData(s:String):void {
results.url = s;
results.send();
}
]]>
</mx:Script>
<mx:ViewStack id="viewstack" width="100%" height="100%"
creationPolicy="all">
<mx:Canvas width="100%" height="100%" >
<mx:BarChart id="chart2" height="100%" width="47%"
x="{chart1.width - 11}"
paddingBottom="30" paddingLeft="0" paddingRight="0"
paddingTop="15"
showDataTips="false"
dataProvider="{results.lastResult.data.population} " >
<mx:verticalAxis>
<mx:CategoryAxis categoryField="age" />
</mx:verticalAxis>
<mx:verticalAxisRenderer>
<mx:AxisRenderer showLabels="true" showLine="true"
visible="false" />
<!--mx:AxisRenderer showLabels="false"
showLine="false" visible="false" /-->
</mx:verticalAxisRenderer>
<mx:series>
<mx:BarSeries id="seriesF" yField="age" xField="f"
displayName="F">
<mx:fill>
<mx:SolidColor color="#FF3333"/>
</mx:fill>
</mx:BarSeries>
</mx:series>
<mx:horizontalAxis>
<mx:LinearAxis id="lineF" />
</mx:horizontalAxis>
</mx:BarChart>
<mx:BarChart id="chart1" height="100%" width="53%"
paddingBottom="30" paddingLeft="0" paddingRight="0"
paddingTop="15"
showDataTips="true"
dataProvider="{results.lastResult.data.population} ">
<mx:verticalAxis>
<mx:CategoryAxis categoryField="age" />
</mx:verticalAxis>
<mx:verticalAxisRenderer>
<mx:AxisRenderer showLine="true" showLabels="true" />
</mx:verticalAxisRenderer>
<mx:series>
<mx:BarSeries id="seriesM" yField="age" xField="m"
displayName="M">
<mx:fill>
<mx:SolidColor color="#0066FF"/>
</mx:fill>
</mx:BarSeries>
</mx:series>
<mx:horizontalAxis>
<mx:LinearAxis id="lineM" />
</mx:horizontalAxis>
</mx:BarChart>
</mx:Canvas>
</mx:ViewStack>
</mx:Canvas>
</mx:Application>
=== data ChartData.aspx ===
<?xml version="1.0" encoding="utf-8"?><data><chartType>Pyramid</
chartType><graphTitle>Hong Kong Resident Population by
Single Age (up to 75+), Sex, 2006 - </graphTitle><xAxisLabel>Single
Age (up to 75+)</xAxisLabel><yAxisLabel>Hong Kong
Resident Population</yAxisLabel><population><age>0</age><m>-21202</
m><f>18216</f></population><population><age>1</age><m>-
20340</m><f>18951</f></population><population><age>2</age><m>-20628</
m><f>19529</f></population><population><age>3</age><m>
-23789</m><f>23247</f></population><population><age>4</age><m>-
24474</m><f>22229</f></population><population><age>5</age><m>-29418</
m><f>26853</f></population><population><age>6</age><m>
-29503</m><f>26859</f></population><population><age>7</age><m>-
30874</m><f>28263</f></population><population><age>8</age><m>-33750</
m><f>32792</f></population><population><age>9</age><m>
-37991</m><f>36912</f></population><population><age>10</age><m>-
40517</m><f>37666</f></population><population><age>11</age><m>-
42775</m><f>40078</f></population><population><age>12</age><m>-
42316</m><f>40835</f></population><population><age>13</age><m>-
43266</m><f>41287</f></population><population><age>14</age><m>-
43708</m><f>41407</f></population><population><age>15</age><m>-
44155</m><f>41484</f></population><population><age>16</age><m>-
46082</m><f>42066</f></population><population><age>17</age><m>-
47828</m><f>46025</f></population><population><age>18</age><m>-
42779</m><f>43156</f></population><population><age>19</age><m>-
42525</m><f>43137</f></population><population><age>20</age><m>-
44469</m><f>43301</f></population><population><age>21</age><m>-
45022</m><f>46573</f></population><population><age>22</age><m>-
44845</m><f>50019</f></population><population><age>23</age><m>-
44431</m><f>52055</f></population><population><age>24</age><m>-
46067</m><f>52986</f></population><population><age>25</age><m>-
45228</m><f>54470</f></population><population><age>26</age><m>-
45471</m><f>56853</f></population><population><age>27</age><m>-
43269</m><f>54751</f></population><population><age>28</age><m>-
44279</m><f>56332</f></population><population><age>29</age><m>-
45457</m><f>56177</f></population><population><age>30</age><m>-
44433</m><f>56519</f></population><population><age>31</age><m>-
47022</m><f>61736</f></population><population><age>32</age><m>-
48958</m><f>64498</f></population><population><age>33</age><m>-
50303</m><f>64795</f></population><population><age>34</age><m>-
48305</m><f>63270</f></population><population><age>35</age><m>-
47915</m><f>65813</f></population><population><age>36</age><m>-
48485</m><f>67296</f></population><population><age>37</age><m>-
48788</m><f>68335</f></population><population><age>38</age><m>-
51073</m><f>65873</f></population><population><age>39</age><m>-
51136</m><f>62646</f></population><population><age>40</age><m>-
54988</m><f>68237</f></population><population><age>41</age><m>-
58958</m><f>72710</f></population><population><age>42</age><m>-
62466</m><f>76768</f></population><population><age>43</age><m>-
66162</m><f>79172</f></population><population><age>44</age><m>-
62873</m><f>69161</f></population><population><age>45</age><m>-
65742</m><f>69544</f></population><population><age>46</age><m>-
66430</m><f>69567</f></population><population><age>47</age><m>-
66000</m><f>67341</f></population><population><age>48</age><m>-
62934</m><f>66476</f></population><population><age>49</age><m>-
62391</m><f>63230</f></population><population><age>50</age><m>-
58857</m><f>59838</f></population><population><age>51</age><m>-
55300</m><f>56830</f></population><population><age>52</age><m>-
54259</m><f>54727</f></population><population><age>53</age><m>-
49158</m><f>49532</f></population><population><age>54</age><m>-
47179</m><f>48453</f></population><population><age>55</age><m>-
45796</m><f>46085</f></population><population><age>56</age><m>-
48714</m><f>46157</f></population><population><age>57</age><m>-
43595</m><f>42214</f></population><population><age>58</age><m>-
39249</m><f>37998</f></population><population><age>59</age><m>-
37298</m><f>35196</f></population><population><age>60</age><m>-28802</
m><f>28154</f>
</population><population><age>61</age><m>-26908</m><f>25892</f></
population><population><age>62</age><m>-
26743</m><f>23643</f></population><population><age>63</age><m>-
23500</m><f>19955</f></population><population><age>64</age><m>-
22366</m><f>19836</f></population><population><age>65</age><m>-
24362</m><f>20986</f></population><population><age>66</age><m>-
24385</m><f>22069</f></population><population><age>67</age><m>-
25233</m><f>23972</f></population><population><age>68</age><m>-
25154</m><f>23954</f></population><population><age>69</age><m>-
25699</m><f>25008</f></population><population><age>70</age><m>-
23407</m><f>24559</f></population><population><age>71</age><m>-
22405</m><f>22737</f></population><population><age>72</age><m>-
23111</m><f>24454</f></population><population><age>73</age><m>-
22370</m><f>23647</f></population><population><age>74</age><m>-21079</
m><f>21284</f></population>
<population><age>75 and over</age><m>-156207</m><f>226714</f></
population></data>
kanchunkin@gmail.com Guest
-
I had flex 2 and charting, Flex 3 only standard afterupgarde
We purchased Flex 2 back in November/December last year, after being told we could upgrade fairly cheaply to Flex 3 We purchased Flex 2 with... -
flex 2 charting
I have FB 2 and have starting using the charts, however it always shows the 'Flex Charting Trial' watermark. I understand i need to purchase the... -
Flex Charting 2 with Flex Builder 3
I've recently inherited a code base that was built on Flex 2 and uses the Flex 2 Charting component. Flex Builder 3 is the only version of Builder... -
Population pyramid
Can anyone expert out here give me some hints how can I construct a population pyramid using flex charting please? -- peter -
Charting Capabilities in Flex 2.0
Hello Could anyone please tell me whether the following are possible with Flex charts? 1) Dragging across an area of a chart and having it...



Reply With Quote

