flex的一些图例

Flex按时间段画动态曲线图，代码如下:

?

<?xml version="1.0"?>
<!-- Simple example to demonstrate the DateTimeAxis class. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"? creationComplete="init()">

??? <mx:Script>
??????? <![CDATA[
??????????? import mx.charts.chartClasses.AxisLabelSet;
??????????? import mx.formatters.DateFormatter;
??????????? import mx.charts.chartClasses.IAxis;
??????????? import mx.collections.ArrayCollection;

??????????? [Bindable]
??????????? public var testDatas:ArrayCollection;
???????????
??????????? [Bindable]
??????????? private var maxDate:Date;
??????????? [Bindable]
??????????? private var minDate:Date;
???????????
??????????? private var timer:Timer;
??????????? private var dateFormat:DateFormatter = new DateFormatter();
??????????? private var dateVar:Date;

??????????? private function init():void {
??????????????????????
??????????????? dateFormat.formatString = "HH:NN:SS";?????
??????????????? minDate = new Date();
??????????????? var dx:Date = new Date();
??????????????? dx.setMinutes(dx.getMinutes()+1,dx.getSeconds(),dx.getMilliseconds());
??????????????? maxDate = dx;
???????????????
??????????????? dateVar = new Date();
??????????????? testDatas = new ArrayCollection([{date: dateVar,valueTest: 101.71} ]);
??????????????????
??????????????? timer =? new Timer(1000);
??????????????? timer.addEventListener(TimerEvent.TIMER,getDatas)
?????????????????? timer.start();
??????????????????
??????????? }
???????????
??????????? private function mylabel(labelValue:Object,previousValue:Object,d:IAxis):String {
??????????????? var str:String = dateFormat.format(labelValue);
??????????????? return str;
??????????? }
???????????
??????????? private function getDatas(et:Event):void {
??????????????? var valueTestValue:int = Math.random()*50;
?????????????????? var dm:Date = new Date();
?????????????????? dm.setTime(dateVar.getTime());
?????????????????? dm.setSeconds(dm.getSeconds()+1,dm.getMilliseconds());
?????????????????? dateVar = dm;
??????????????????
?????????????????? if (dateVar.getTime()>maxDate.getTime()) {
?????????????????????? maxDate = dateVar;
?????????????????????? var dx:Date = new Date();
?????????????????????? dx.setMinutes(dx.getMinutes()-1,dx.getMilliseconds());
?????????????????????? minDate = dx;
?????????????????? }
???????????????? testDatas.addItem({date: dateVar,valueTest: valueTestValue});?????
???????????????
??????????? }
???????????
??????? ]]>
??? </mx:Script>

??? <mx:Panel title="DateTimeAxis Example" height="100%" width="100%">
??????? <mx:LineChart id="mychart" height="100%" width="100%"
??????????? paddingRight="5" paddingLeft="5"
??????????? showDataTips="true" >
???????????
??????????? <mx:horizontalAxis>
??????????????? <mx:DateTimeAxis dataUnits="seconds" interval="5" minimum="{minDate}"?? maximum="{maxDate}" labelFunction="mylabel"?? />
??????????? </mx:horizontalAxis>

??????????? <mx:verticalAxis>
??????????????? <mx:LinearAxis baseAtZero="true" />
??????????? </mx:verticalAxis>

??????????? <mx:series>
?????????????? <mx:LineSeries yField="valueTest" xField="date" displayName="TestData" dataProvider="{this.testDatas}"/>
??????????? </mx:series>
??????? </mx:LineChart>
??? </mx:Panel>
</mx:Application>

?

flex使用后台返回xml生成饼状图

<?xml version="1.0"?>
<!-- Simple example to demonstrate the DateTimeAxis class. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"? creationComplete="init()">

??? <mx:Script>
??????? <![CDATA[
???????? import mx.controls.Alert;
??????????? import mx.charts.chartClasses.AxisLabelSet;
??????????? import mx.formatters.DateFormatter;
??????????? import mx.charts.chartClasses.IAxis;
??????????? import mx.collections.ArrayCollection;

??????????? [Bindable]
??????????? public var testDatas:ArrayCollection;
??????????
??????????? [Bindable]
??????????? private var maxDate:Date;
??????????? [Bindable]
??????????? private var minDate:Date;
??????????
??????????? private var timer:Timer;
??????????? private var dateFormat:DateFormatter = new DateFormatter();
??????????? private var dateVar:Date;

??????????? private function init():void {
?????????????????????
??????????????? dateFormat.formatString = "HH:NN:SS";????
??????????????? minDate = new Date();
??????????????? var dx:Date = new Date();
??????????????? dx.setMinutes(dx.getMinutes()+1,dx.getMilliseconds());
??????????????? maxDate = dx;
??????????????
??????????????? dateVar = new Date();
??????????????? testDatas = new ArrayCollection([{date: dateVar,valueTest: 101.71} ]);
?????????????????
??????????????? timer =? new Timer(1000);
??????????????? timer.addEventListener(TimerEvent.TIMER,getDatas);
?????????????????? timer.start();
?????????????????
??????????? }
??????????
??????????? private function mylabel(labelValue:Object,d:IAxis):String {
??????????????? var str:String = dateFormat.format(labelValue);
??????????????? return str;
??????????? }
??????????
??????????? private function getDatas(et:Event):void {
??????????????? var valueTestValue:int = Math.random()*50;
?????????????????? var dm:Date = new Date();
?????????????????
?????????????????? dm.setTime(dateVar.getTime());
?????????????????? dm.setSeconds(dm.getSeconds()+1,dm.getMilliseconds());
?????????????????? dateVar = dm;
?????????????????
?????????????????? if (dateVar.getTime()>maxDate.getTime()) {
?????????????????????? maxDate = dateVar;
?????????????????????? var dx:Date = new Date();
?????????????????????? dx.setMinutes(dx.getMinutes()-1,valueTest: valueTestValue});????
??????????????? //Alert.show("list长度为: "+testDatas.length);
??????????? }
??????????
??????? ]]>
??? </mx:Script>

??? <mx:Panel title="DateTimeAxis Example" height="100%" width="100%">
??????? <mx:LineChart id="mychart" height="100%" width="100%"
??????????? paddingRight="2" paddingLeft="3"
??????????? showDataTips="true" >
??????????
??????????? <mx:horizontalAxis>
??????????????? <mx:DateTimeAxis dataUnits="seconds" interval="3" minimum="{minDate}"?? maximum="{maxDate}" labelFunction="mylabel"?? />
??????????? </mx:horizontalAxis>

??????????? <mx:verticalAxis>
??????????????? <mx:LinearAxis baseAtZero="true" />
??????????? </mx:verticalAxis>

??????????? <mx:series>
?????????????? <mx:LineSeries yField="valueTest" xField="date" displayName="TestData" dataProvider="{this.testDatas}"/>
??????????? </mx:series>
??????? </mx:LineChart>
??? </mx:Panel>
</mx:Application>

?

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:esri="http://www.esri.com/2008/ags" creationComplete="init();">
<!-- 从后台获取数据 -->
??? <mx:HTTPService url="http://localhost:8083/ashx/getdata.ashx" id="serviceid"
??? result="serviceResult(event);" fault="serviceFault(event)" showBusyCursor="true"
???? method="POST" resultFormat="e4x">//注意resultFormat
???? </mx:HTTPService>
???? <mx:Script>
???????? <![CDATA[
???????? import mx.collections.ArrayCollection;
???????? import mx.effects.easing.*;
???????????? import mx.rpc.events.FaultEvent;
???????????? import mx.rpc.events.ResultEvent;
???????????? import mx.controls.Alert;

???????????? [Bindable]
???????????? private var xmlResults:XML;
???????????? [Bindable]
???????????? private var arr:ArrayCollection;
????????????
??? private function init():void{
???? var params:Object={};
??? params["handle"]="pie";
??? serviceid.send(params);
??? }

??????????? //trace the result of the service out
??????????? private function serviceResult(event:ResultEvent):void {//注意事件类型
????????????? xmlResults = event.result as XML;
??????????? arr = new ArrayCollection();
//??????????? pieChartId.dataProvider=arr;
//??????????? Alert.show(xmlResults.toXMLString()+xmlResults.length());
//??????????? Alert.show(xmlResults.toXMLString()+xmlResults.children().length());
????????????? for each(var arrxml:XML in xmlResults.children()){
?????????????? arr.addItem(arrxml);
??????????? }
//??????????? Alert.show(arr[0].TATOL);
???????????
??????????? }

??????????? // in the event that the service faults or times out
??????????? private function serviceFault(event:Event):void {
??????????????? trace('broken service');
??????????? }

??? /*???????? private function callService():void {
???????????
??????????????? serviceid.send();
??????????? } */
???????? ]]>
???? </mx:Script>
?? <!-- -->
?? <mx:Canvas>
<mx:PieChart id="pieChartId" dataProvider="{arr}" showDataTips="true">
??????? <mx:series>
???????? <mx:PieSeries field="TATOL" nameField="AREANAME" labelPosition="callout" displayName="AREANAME">
???????? </mx:PieSeries>
??????? </mx:series>
???? </mx:PieChart>
???? <mx:Legend dataProvider="{pieChartId}"/>
???? </mx:Canvas>
???
</mx:Application>

程序代码 程序代码

<?xml version="1.0" encoding="UTF-8"?>
<data>
??? <result month="1 月">
??????? <apple>81768</apple>
??????? <orange>60310</orange>
??????? <banana>43357</banana>
??? </result>
??? <result month="2 月">
??????? <apple>81156</apple>
??????? <orange>58883</orange>
??????? <banana>59280</banana>
??? </result>
??? <result month="3 月">
??????? <apple>72768</apple>
??????? <orange>63031</orange>
??????? <banana>41357</banana>
??? </result>
??? <result month="4 月">
??????? <apple>85156</apple>
??????? <orange>54883</orange>
??????? <banana>47280</banana>
??? </result>
</data>

方法一: 用Model和source获取xml
程序代码 程序代码

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">
? <mx:Model id="results" source="price.xml"/>
? <mx:Panel title=" 用Model和source获取xml">
???? <mx:LineChart id="myChart" dataProvider="{results.result}" showDataTips="true">
??????? <mx:horizontalAxis>
?????????? <mx:CategoryAxis categoryField="month"/>
??????? </mx:horizontalAxis>
??????? <mx:series>
?????????? <mx:LineSeries yField="banana" displayName="Banana"/>
?????????? <mx:LineSeries yField="apple" displayName="Apple"/>
?????????? <mx:LineSeries yField="orange" displayName="Orange"/>
??????? </mx:series>
???? </mx:LineChart>
???? <mx:Legend dataProvider="{myChart}"/>????
? </mx:Panel>
</mx:Application>

方法二:
将xml数据源转换成Array再作为图表的数据源
程序代码 程序代码

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
??? width="100%" height="100%">
? <mx:Script>
???? import mx.utils.ArrayUtil;
? </mx:Script>

? <mx:Model id="results" source="price.xml"/>
? <mx:ArrayCollection id="myAC"
??????? source="{ArrayUtil.toArray(results.result)}"
? />

? <mx:Panel title=" 将xml转换成Array形式的数据源">
???? <mx:LineChart id="myChart" dataProvider="{myAC}" showDataTips="true">
??????? <mx:horizontalAxis>
?????????? <mx:CategoryAxis categoryField="month"/>
??????? </mx:horizontalAxis>
??????? <mx:series>
?????????? <mx:LineSeries yField="banana" displayName="Banana"/>
?????????? <mx:LineSeries yField="apple" displayName="Apple"/>
?????????? <mx:LineSeries yField="orange" displayName="Orange"/>
??????? </mx:series>
???? </mx:LineChart>
???? <mx:Legend dataProvider="{myChart}"/>????
? </mx:Panel>
</mx:Application>

方法三: 用HTTPService来获取xml数据源
程序代码 程序代码

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
??? width="100%" height="100%" creationComplete="srv.send()">
? <mx:HTTPService id="srv" url="price.xml"/>

? <mx:Panel title=" 用HTTPService来获取xml数据源">
???? <mx:LineChart id="myChart"
??????? dataProvider="{srv.lastResult.data.result}"
??????? showDataTips="true"
???? >
??????? <mx:horizontalAxis>
?????????? <mx:CategoryAxis categoryField="month"/>
??????? </mx:horizontalAxis>
??????? <mx:series>
?????????? <mx:LineSeries yField="apple" displayName="Apple" name="Apple"/>
?????????? <mx:LineSeries yField="orange" displayName="Orange" name="Orange"/>
?????????? <mx:LineSeries yField="banana" displayName="Banana" name="Banana"/>
??????? </mx:series>
???? </mx:LineChart>
???? <mx:Legend dataProvider="{myChart}"/>????
? </mx:Panel>??
</mx:Application>

方法四:将HTTPService 获取的数据源转换成ArrayCollection

注意: HTTPService需要 creationComplete="srv.send()"来获取数据源

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="srv.send()">
? <mx:Script><![CDATA[
???? import mx.collections.ArrayCollection;
???? [Bindable]
???? public var myData:ArrayCollection;
? ]]></mx:Script>

? <mx:HTTPService
???? id="srv"
???? url="price.xml"
???? useProxy="false"
???? result="myData=ArrayCollection(srv.lastResult.data.result)"? />
? <mx:Panel title="HttpService to ArrayCollection">
???? <mx:LineChart id="myChart" dataProvider="{myData}" showDataTips="true">
??????? <mx:horizontalAxis>
?????????? <mx:CategoryAxis categoryField="month"/>
??????? </mx:horizontalAxis>
??????? <mx:series>
?????????? <mx:LineSeries yField="apple" displayName="Apple" name="Apple"/>
?????????? <mx:LineSeries yField="orange" displayName="Orange" name="Orange"/>
?????????? <mx:LineSeries yField="banana" displayName="Banana" name="Banana"/>
??????? </mx:series>
???? </mx:LineChart>
???? <mx:Legend dataProvider="{myChart}"/>????
? </mx:Panel>
</mx:Application>

?

Flex： 实时曲线图(定时获取后台数据)

<?xml version="1.0" encoding="utf-8"?>??
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="initApp()">??
<mx:Script>??
??? <![CDATA[??
??????? import mx.collections.ArrayCollection;??
??????? [Bindable]??
??????? private var gprsAC:ArrayCollection = new? ArrayCollection();??
??????????????
??????????????
??????? private static const MINISECENDS:int=1000;??
????????? private function initApp():void?
????????? {??
????????????? setInterval(addArr,MINISECENDS);??
????????? }??
????????????
????????? private var i:Number = 1;??
????????? private var tmp_obj:Object;??
????????? private function addArr():void?
????????? {??
????????????? tmp_obj = new Object();??
????????????? var temp_count:Number = Math.ceil(Math.random()*100);??
??????????? tmp_obj["time"]=i;??
??????????? tmp_obj["count"]=temp_count;??
????????????? gprsAC.addItem(tmp_obj);??
????????????? i++;??
????????????? if(i==24)??
????????????? {??
????????????????? i = 1;??
????????????? }??
????????? }??
??? ]]>??
</mx:Script>??
?
???????
??? <mx:LineChart id="linchart"? color="#333399" width="100%" height="100%"? dataProvider="{gprsAC}"?
?????????????????????????????????? showDataTips="true" fontSize="12"? y="77" x="10">??
?????????????????????????????????? <mx:horizontalAxis>??
?????????????????????????????????????? <mx:CategoryAxis categoryField="time"/>??
?????????????????????????????????? </mx:horizontalAxis>???
??????????????????????????????????? <mx:backgroundElements>??
???????????????????????????????????????????? <mx:GridLines direction="horizontal">??
???????????????????????????????????????????????? <mx:horizontalStroke>??
???????????????????????????????????????????????????? <mx:Stroke weight="1.5" color="#333399" alpha="0.2"/>??
???????????????????????????????????????????????? </mx:horizontalStroke>??
???????????????????????????????????????????? </mx:GridLines>??
??????????????????????????????????? </mx:backgroundElements>??
?????????????????????????????????? <mx:series>??
?????????????????????????????????????? <mx:LineSeries id="lineserie" width="160" yField="count"?? />??
?????????????????????????????????? </mx:series>??
?????????????????????????????? </mx:LineChart>??
</mx:Application>?

?

这里主要是通过setInterval(addArr,MINISECENDS);来实现一秒跳动一次的。当然还有setTime来做 不过setTime做起来感觉很麻烦。
如果想通过后台交互的话 那就改改addArr这个方法就行啦 代码如下：

?

<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"? width="100%" creationComplete="init();">????
<mx:Style>??
??? .font12{font-family:宋体;fontSize:15}??
</mx:Style>??
??? <mx:Script><![CDATA[?????
??????? import mx.collections.ArrayCollection;???
???????? import mx.rpc.events.ResultEvent;????
???????? import mx.controls.Alert;??
?????????
?
??????? [Bindable]?????
??????? private var expenses:ArrayCollection = new ArrayCollection();???
???????????? private function init():void{??
????????????????? setInterval(torequest,2000);??
???????????? }???
???????????? public function torequest():void{????????????????????????????????????????????????????????????????????????????
???????????????????? realtimeservice.send();?????
???????????????????? realtimeservice.addEventListener(ResultEvent.RESULT,getResult);???????????????????????
???????????? }???
??????????????????
??????????? private var tmpobj:Object;??
???????????? private function getResult(e:ResultEvent):void{????
?????????????????????? tmpobj = new Object();??
?????????????????????? tmpobj["Day"] =(String)(e.result.Day);??
?????????????????????? tmpobj["alpha"] =(String)(e.result.alpha);??????
??????????????????????? tmpobj["beta"] =(String)(e.result.beta);??
?????????????????????? tmpobj["gama"] =(String)(e.result.gama);?????
?????????????????????? if (expenses.length==20){??
??????????????????????????? var i:int ;????????????????????????????????????????????????
??????????????????????????? for ( i= 1 ; i<20; i++){???
??????????????????????????????? expenses.setItemAt(expenses.getItemAt(i),i-1);??
??????????????????????????? }?????
?????????????????????????? expenses.setItemAt(tmpobj,expenses.length-1);??
?????????????????????????????
?????????????????????? }else{??
??????????????????????? expenses.addItem(tmpobj);??
?????????????????????? }??
??????????????????????????
???????????? }??
?????????????????
??? ]]></mx:Script>???
??????
??? <mx:HTTPService id="realtimeservice" url="http://localhost:8080/flexcharttest/realtime.servlet" useProxy="false" method="POST">??
??????????
??? </mx:HTTPService>????
???? <mx:ApplicationControlBar dock="true" cornerRadius="14" fillAlphas="[1.0,1.0]" fillColors="[#8BBED9,#FDFAFA]" themeColor="#74B2D9" >???
???????? <mx:Spacer width="100%" />???
?<mx:Legend dataProvider="{chart}"/>??
??? </mx:ApplicationControlBar>??
? <mx:Panel title="曲线图" fontSize="15" width="100%" borderColor="#F7F2F2" themeColor="#F8FAFB"? backgroundColor="#F9F5F5" borderStyle="inset">?????
???
???????
??????? <mx:LineChart dataProvider="{expenses}" showDataTips="true" width="100%" id="chart" fontFamily="宋体"? fontSize="12">?????
??????????? <mx:horizontalAxis>?????
??????????????? <mx:CategoryAxis categoryField="Day" displayName="day" title="随机数" />?????
??????????? </mx:horizontalAxis>?????
??????????? <mx:series>????
?????????????
???????????????????
????????????????????? <mx:LineSeries yField="alpha" displayName="alpha浓度" styleName="font12" />??????????
???????????????????? <mx:LineSeries yField="beta" displayName="beta"? />??????????
????????????????????? <mx:LineSeries yField="gama" displayName="gama" />??????
??????????????
??????????? </mx:series>?????
??????? </mx:LineChart>?????
?????????
???
??? </mx:Panel>?????
??????
</mx:Application>?

?

使用infoSymbol，用flex的饼图柱状图进行渲染

<esri:InfoSymbol id="PointSym" infoPlacement="center" containerStyleName="InfoSymbol">
????????? <esri:infoRenderer>
????????????? <mx:Component>
????????????????? <mx:VBox width="100%" height="100%" backgroundAlpha="0">
?????????????????? <mx:ieChart id="pieChart" dataProvider="{data}" width="90" height="90" showDataTips="true">
??????????????????? <mx:series>
??????????????????? <mx:ieSeries field="num" labelField="name" labelPosition="inside">
?????????????????????? <mx:fills>?
??????????????????????????? <mx:Array>?
??????????????????????????????? <mx:RadialGradient>?
??????????????????????????????????? <mx:entries>?
??????????????????????????????????????? <mx:Array>?
?????????????????????????????????????????? <mx:GradientEntry color="#FF0000" ratio="0"/>
??????????????????????????????????????? </mx:Array>?
??????????????????????????????????? </mx:entries>?
??????????????????????????????? </mx:RadialGradient>
??????????????????????????????? <mx:RadialGradient>?
??????????????????????????????????? <mx:entries>
??????????????????????????????????????? <mx:Array>?
?????????????????????????????????????????? <mx:GradientEntry color="#00ff00" ratio="0"/>
??????????????????????????????????????? </mx:Array>?
??????????????????????????????????? </mx:entries>?
??????????????????????????????? </mx:RadialGradient>
??????????????????????????? </mx:Array>?
??????????????????????? </mx:fills>?????????????
???????????????????? </mx:ieSeries>
?????????????????????? </mx:series>
????????????????? </mx:ieChart>
???????????????? </mx:VBox>
??????????? </mx:Component>
??????? </esri:infoRenderer>
??? </esri:InfoSymbol>

注：chart里面的{data}就是渲染的graphic的attribute

?

接下来的例子演示了Flex中如何将数据转化为图表的形式表示。

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
??????? layout="vertical"
??????? verticalAlign="middle"
??????? backgroundColor="white">
?
??? <mx:Script>
??????? <![CDATA[
??????????? [Bindable]
??????????? [Embed(source='assets/money.png')]
??????????? private var MoneyIcon:Class;
??????? ]]>
??? </mx:Script>
?
??? <mx:XML id="quotesXML" source="adbe.xml" format="e4x" />
??? <mx:XMLListCollection id="adbe" source="{quotesXML.quote}" />
?
??? <mx:String id="ADBE_YAHOO">http://finance.yahoo.com/q?d=t&amp;s=ADBE</mx:String>
?
??? <mx:ApplicationControlBar dock="true">
??????? <mx:LinkButton icon="{MoneyIcon}"
??????????????? label="ADBE"
??????????????? click="navigateToURL(new URLRequest(ADBE_YAHOO))"
??????????????? fontSize="14"
??????????????? fontWeight="bold" />
??? </mx:ApplicationControlBar>
?
??? <mx:VBox backgroundColor="white" width="100%" height="100%">
??????? <mx:HLOCChart id="hlocChart"
??????????????? showDataTips="true"
??????????????? dataProvider="{adbe}"
??????????????? width="100%"
??????????????? height="100%">
?
??????????? <!-- vertical axis -->
??????????? <mx:verticalAxis>
??????????????? <mx:LinearAxis baseAtZero="false" />
??????????? </mx:verticalAxis>
?
??????????? <!-- horizontal axis -->
??????????? <mx:horizontalAxis>
??????????????? <mx:CategoryAxis categoryField="@date" title="Date"/>
??????????? </mx:horizontalAxis>
?
??????????? <!-- series -->
??????????? <mx:series>
??????????????? <mx:HLOCSeries id="series1"
??????????????????????? highField="@high"
??????????????????????? lowField="@low"
??????????????????????? openField="@open"
??????????????????????? closeField="@close"/>
??????????? </mx:series>
??????? </mx:HLOCChart>
??? </mx:VBox>
?
</mx:Application>

?

]

++++++++++++++++++
FLEX 解析XML的方式
<?xml version="1.0" encoding="utf-8"?>???
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init();loaderxml();" verticalScrollPolicy="off" horizontalScrollPolicy="off">???
???? <mx:HTTPService id="parseXml" showBusyCursor="true" url="brow.xml">???
???????????
???? </mx:HTTPService>???
???? <mx:Script>???
???????? <![CDATA[???
???????????? import mx.collections.ArrayCollection;???
???????????? import mx.rpc.events.FaultEvent;???
???????????? import mx.rpc.events.ResultEvent;???
???????????? private var arr:ArrayCollection???
???????????? private function init(){???
???????????????? parseXml.send();???
???????????????? parseXml.addEventListener(ResultEvent.RESULT,result);???
???????????????? parseXml.addEventListener(FaultEvent.FAULT,fault);???
???????????? }???
???????????????
???????????? private function fault(event:FaultEvent){???
???????????????? trace(event.message)???
???????????? }???
???????????? private function result(event:ResultEvent){???
???????????????? trace("result:"+event.result.brows.brow as ArrayCollection);//输出null;单下边???
???????????????? arr=event.result.brows.brow //这可以转成ArrayCollecation???
???????????????? trace(arr.getItemAt(0).sp.toString());//输出kang???
???????????????? trace("label:"+arr.getItemAt(0).label.toString());//输出""??
???????????????????
???????????????? trace(parseXml.lastResult.brows.brow[0].sp);//输出kang???
???????????????? trace(parseXml.lastResult.brows.brow[1].icon)//输出 img/Face/1.swf???
???????????? }???
???????????? private function loaderxml(){???
???????????????? var url="brow.xml";???
???????????????? var ul:URLLoader=new URLLoader();???
???????????????? ul.load(new URLRequest(url));???
???????????????? ul.addEventListener(Event.COMPLETE,areadyLoad);???
???????????? }???
???????????? private function areadyLoad(event:Event){???
???????????????? var xml:XML=XML(event.target.data);???
???????????????? trace(xml.brow[0].sp);//输出kang???
???????????????? trace(xml.brow[1].@data);//输出1??
???????????????????
???????????????? var obj1:Object="<sp>hello</sp>";???
???????????????? var obj2:Object="<ss>sdfasf</ss>"??
???????????????? xml.appendChild(obj1);???
???????????????? trace(xml.toXMLString());//最后加了一句<sp>hello</sp>???
???????????? }???
???????? ]]>???
???? </mx:Script>???
</mx:Application>??
一起的

<?xml version="1.0" encoding="UTF-8"?>??
<brows>??
??????????????? <brow data="0" tp="微笑" label="" icon="img/Face/0.swf">??
??????????????? <sp>kang</sp>??
??????????????? </brow>??
??????????????? <brow data="1" tp="撇嘴" label="a" icon="img/Face/1.swf"/>??
??????????????? <brow data="2" tp="撇嘴" label="b" icon="img/Face/2.swf"/>??
??????????????? <brow data="3" tp="撇嘴" label="c" icon="img/Face/3.swf"/>??
??????????????? <brow data="4" tp="撇嘴" label="d" icon="img/Face/4.swf"/>??
??????????????? <brow data="5" tp="撇嘴" label="e" icon="img/Face/5.swf"/>??
<brows>??
?

?

?

?

------------------------------

去年年底的时候，所做的一个rails项目涉及到图表功能，主要有显示投票结果（柱状图）、网上办事统计结果（饼状图）、已办事件按月统计结果（线状图）……，当时可真是一件很麻烦的事情，开始准备搬flex来做，结果考虑到开发成本等等原因没采用，后来是自己写js，做了好一段时间，结果在跨平台上效果却不是很理想。当时真是苦煞我也，心想要是请几个专职的google专家来帮我做成和google一样的效果多好啊，巧合的是Google于去年晚些时候悄然推出了新图表API。Google图表最初是作为视频和财经服务的一项中间项目，后来Google决定将其公诸于世。Google始终如一地向大家提供如此优雅和高效的解决方案来处理通用问题，当然Google图表也不例外。

????? 那么是Google图表是如何为我们服务的呢？主要通过简单地发送一条URL来生成图表，调用者的主要工作是构建这些URL，该URL最主要有以下三个参数：图表的类型、图表的大小和图表的数据。图表的类型由“cht”参数指定。图表大小用chs指定，包括图表的长和宽，用整数来表示。图表数据用chd表示，Google提供了四种不同的数据编码方式，最简单的就是文本编码。通过给数据添加“t:”前缀。比如 http://chart.apis.google.com/chart?cht=lc&chs=100x50&chd=t:25,50 就是一条完整的图表服务路径，更完整的图表API可以参考 http://code.google.com/apis/chart/。

????? 那么接下来我们就是去构建这些URL，这里仍存在2个问题：

1 构建这样的URL需要大量的字符串拼接操作，较为繁琐，对于比较数据量比较大的图表，构建这样的URL就很麻烦。

2 构建这样的URL其实很多地方是重复的，只是少数的参数不一样，对于有大量图表显示的系统来说要做很多重复性的工作。

幸运的是，我们不必重复发明轮子了，DEEpak Jois已经封装了该API，他的gem叫做gchartrb，提供一个整洁简明的方式来生成图表URL。使用该gem的第一步是安装它：gem install gchartrb。 使用起来超乎想象的简单，效果也非常的炫，不信？看看我做的一些demo吧：）

?

场景一 venn图 例如：A有500个元素，B有400个元素，C有300个元素，AB交集为200，AC交集为100， BC交集为50通过以上的数据得到代表变量A,B,C的三个圆圈，圆圈的面积代表变量所含元素个数，圆圈的交集代表变量之间的交集。

?

Java代码
require 'rubygems'?
require 'google_chart'?
def venn_diagram??
??? GoogleChart::VennDiagram.new("400x400",'Venn Diagram') do |vd|??
????? vd.data "Blue",500,'0000ff'?
????? vd.data "Green",400,'00ff00'?
????? vd.data "Red",300,'ff0000'?
????? vd.intersections 200,100,50?
????? @chart = vd.to_url??
??? end??
end?

require 'rubygems'
require 'google_chart'
def venn_diagram
??? GoogleChart::VennDiagram.new("400x400",'Venn Diagram') do |vd|
????? vd.data "Blue",'0000ff'
????? vd.data "Green",'00ff00'
????? vd.data "Red",'ff0000'
????? vd.intersections 200,50
????? @chart = vd.to_url
??? end
endJava代码
<%= image_tag @chart %>??

<%= image_tag @chart %>?

?

?

场景二 柱状图 例如JE会员分布图，beijing 20000人， shanghai 18000人，tianjin 10000人，nanjing 8000 ，guangzhou 14000，shenzhen 16000

?

Ruby代码
?def bar_chart??
??? GoogleChart::BarChart.new('800x200',"Bar Chart",:vertical,false) do |bc|??
????? bc.data "beijing",[20000],'0000ff'?
????? bc.data "shanghai",[18000],'ff0000'?
????? bc.data "tianjin",[10000],'00ff00'?
????? bc.data "nanjing",[8000],'00aaff'?
????? bc.data "guangzhou",[16000],'0effee'?
????? bc.data "shenzhen",[14000],'eeff00'?
????? @chart = bc.to_url??
??? end?
? end?

?def bar_chart
??? GoogleChart::BarChart.new('800x200',false) do |bc|
????? bc.data "beijing",'0000ff'
????? bc.data "shanghai",'ff0000'
????? bc.data "tianjin",'00ff00'
????? bc.data "nanjing",'00aaff'
????? bc.data "guangzhou",'0effee'
????? bc.data "shenzhen",'eeff00'
????? @chart = bc.to_url
??? end
? endRuby代码
<%= image_tag @chart %>??

<%= image_tag @chart %>?

?

场景三 饼状图 例如JE文章投票人数统计，very good 200票， good 150票，just so so100票，bad 180票

?

Ruby代码
def pie_chart??
??? GoogleChart::PieChart.new('320x200',"Pie Chart",false) do |pc|??
????? pc.data "very good",300??
????? pc.data "good",200??
????? pc.data "just so so",100??
????? pc.data "bad",180??
????? pc.show_labels = true?
????? @chart = pc.to_url??
??? end?
end?

def pie_chart
??? GoogleChart::PieChart.new('320x200',false) do |pc|
????? pc.data "very good",300
????? pc.data "good",200
????? pc.data "just so so",100
????? pc.data "bad",180
????? pc.show_labels = true
????? @chart = pc.to_url
??? end
endRuby代码
<%= image_tag @chart %>??

<%= image_tag @chart %>??

?

?场景四 折线图 例如统计每周JE会员增加数量，一周的数量分别是 56 48 68 59 66 67 59

?

Ruby代码
GoogleChart::LineChart.new('320x200',"Line XY Chart",true) do |lcxy|??
????? lcxy.data "amount",[[1,56],[2,48],[3,68],[4,59],[5,66],[6,67],[7,59]],'0000ff'?
????? @chart = lcxy.to_url??
end?

GoogleChart::LineChart.new('320x200',true) do |lcxy|
????? lcxy.data "amount",'0000ff'
????? @chart = lcxy.to_url
endRuby代码
<%= image_tag @chart %>??

<%= image_tag @chart %>?

?

这里我分三步描述flash读XML的基本方法，以及外延一个对带命名空间的XML的读取方法，如下目录：

1、加载XML文件；
2、读取XML的数据；
3、过滤数据；
4、读取带命名空间的XML数据；
5、处理gb2312编码的XML；

注：在这里的AS脚本都是在 Adobe Flash CS3 版本以上中进行编写，flex用户请自行添加修改相应的包引用。

下面开始第一部分，如何加载XML文件！

1、加载XML文件
在脚本编辑器中写入以下代码：

var xmlLoader:URLLoader = new URLLoader();
var xmlData:XML = null;
?
xmlLoader.addEventListener(Event.COMPLETE,LoadXML);
xmlLoader.load(new URLRequest("http://www.kirupa.com/net/files/sampleXML.xml"));
?
function LoadXML(e:Event):void {
? xmlData = new XML(e.target.data);
? trace(xmlData);
}按Ctrl+Enter运行它，你会在输出窗口中看到整个XML的内容：

这里不进行代码解说，关于XML类，请查看：http://help.adobe.com/zh_TW/AS3LCR/Flash_10.0/XML.html

下面进入第2部分：如何读取XML数据。

2、读取XML数据
2.1直接读取XML数据
对XML数据的读取是十分简单的，不信请看：

function LoadXML(e:Event):void {
? xmlData = new XML(e.target.data);
? ParseBooks(xmlData);
}
?
function ParseBooks(bookInput:XML):void {
? trace("XML Output");
? trace("------------------------");
? trace(bookInput.Book);
}可得到如何结果：

XML Output
------------------------
?
? Sir Arthur Conan Doyle
?
? F. Scott Fitzgerald
?
? Stephen E. Ambrose
?
? Stephen E. Ambrose

?

2.2、XML和XMLList
这里我们会用到另外一个类XMLList，这个类可以把XML对象作为数组的方式读取，可以方便地进行for each操作。

function ParseBooks(bookInput:XML):void {
? trace("XML Output");
? trace("------------------------");
? var authorList:XMLList = bookInput.Book.author;
? for each (var authorElement:XML in authorList) {
??? trace(authorElement);
? }
} 2.3历遍子元素
function ParseBooks(bookInput:XML):void {
? trace("XML Output");
? trace("------------------------");
? var bookChildren:XMLList = bookInput.Book.children();
? for each (var bookInfo:XML in bookChildren) {
??? trace(bookInfo);
? }
}

?

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" creationComplete="init()">
?
?<mx:VDividedBox x="0" y="0" height="100%" width="100%">
??<mx:Legend dataProvider="{linechart}" height="40%" width="100%"/>
??<mx:HDividedBox x="0" y="0" height="100%" width="100%">
???<mx:LineChart id="linechart" showDataTips="true" x="0" y="0" height="100%" width="80%" dataProvider="{capbility}" >
????<mx:horizontalAxis>
??????????????? ?<mx:CategoryAxis categoryField = "Time" labelFunction="showHour"/>
??????????????? </mx:horizontalAxis>
????<mx:series>
?????<mx:LineSeries displayName="Series 1" yField=""/>
????</mx:series>
???</mx:LineChart>
???<mx:Canvas width="20%" height="100%" id = "can">
???</mx:Canvas>
??</mx:HDividedBox>
?</mx:VDividedBox>
?<mx:Script>
??<![CDATA[
???import mx.graphics.Stroke;
??? ??import mx.events.DragEvent;
??? ??import mx.controls.CheckBox;
??? ??import mx.controls.Alert;
??? ??import mx.collections.ArrayCollection;
??? ??import mx.charts.chartClasses.Series;
??? ??
??? ??private var t:Timer = new Timer(2000);
??? ??private var capItem:Array = new Array();
???private var theName:Array = ["股票1","股票2","股票3"];
???private var i:int=1;
???private var ii:int = 15;
???private var step:int = 10;
???[Bindable]
??????? ?private var capbility:ArrayCollection = new ArrayCollection( [
??????????? { Time: "10:00",股票1: 2000,股票2: 1500,股票3: 450},
??????????? { Time: "10:15",股票1: 1000,股票2: 200,股票3: 600},
??????????? { Time: "10:30",股票1: 1500,股票2: 500,股票3: 300},
??????????? { Time: "10:45",股票1: 1800,股票2: 1200,股票3: 900},
??????????? { Time: "11:00",股票1: 2400,股票2: 575,股票3: 500},
??????????? { Time: "11:15",
??????????? { Time: "11:30",
??????????? { Time: "11:45",
??????????? { Time: "12:00",
??????????? { Time: "12:15",
??????????? { Time: "12:30",
??????????? { Time: "12:45",
??????????? { Time: "13:00",
??????????? { Time: "13:15",
??????????? { Time: "13:30",
??????????? { Time: "13:45",
??????????? { Time: "14:00",
??????????? { Time: "14:15",
??????????? { Time: "14:30",
??????????? { Time: "14:45",
??????????? { Time: "15:00",股票3: 300}]);
???????????
?????????? ?private function init():void{
??? ???for(var i:int = 0;i<theName.length;i++){
??? ????linechart.series = null;
??? ????var cb:CheckBox = new CheckBox();
??? ????var CBmodel:CheckboxModel = new CheckboxModel;
??? ????cb.label = theName[i];
??? ????cb.x = 10 ;
??? ????cb.y = can.y + (i+1)*20;
??? ????CBmodel.setName(theName[i]);
??? ????CBmodel.setId(i);
??? ????cb.data = CBmodel;
??? ????cb.addEventListener(MouseEvent.CLICK,selectThis);
??? ????can.addChild(cb);
??? ????timeBegin();//开始定时
??? ???}
??? ??}
??? ??private function selectThis(e:MouseEvent):void{
??? ???var lineSeries:Array =? linechart.series;
??????? ??var tempSeries:LineSeries = new LineSeries();
??? ???if(e.target.data.getSelected()==0){
??? ????e.target.data.setSelected(1);
?????tempSeries.yField = e.target.data.getName();
?????tempSeries.displayName = e.target.data.getName();
?????tempSeries.setStyle("form","curve");
?????lineSeries.push(tempSeries);
?????linechart.series = lineSeries;
??? ???}else{
??? ????for(var i:int=0;i<lineSeries.length;i++){
??? ?????if(e.target.data.getName() == lineSeries[i].yField){
??? ??????lineSeries.splice(i,1);
??? ?????}
??? ?????linechart.series = lineSeries;
??? ????}
??? ????e.target.data.setSelected(0);
??? ???}
??? ??}
??? ??private function showHour(cat:Object,pcat:Object,ax:CategoryAxis,labelItem:Object):String{
??? ???var re:String = "";
??? ???var theTime:String = labelItem.Time;
??? ???var x:Array = theTime.split(":");
??? ???if(x[1] == "00"){
??? ????re = x[0];
??? ???}else re = "";??? ????
?????return re;
???}
???public function timeBegin():void{
??? ?????t.start();
??? ?????t.addEventListener(TimerEvent.TIMER,doTime);
??? ??}
??? ??private function doTime(e:Event):void{
??? ????var time1:String;
??? ?????? var time2:String = new String((i%4)*15);
??? ?????? var x1:int;
??? ?????? var x2:int;
??? ?????? var x3:int;
??? ?????? i++;
??? ?????? if(time2 == "0")time2 = "00";
??? ?????? if(time2=="00"){
??? ?????? ?ii = ii+1;
??? ?????? ?time1 =new String(((ii)%24));
??? ?????? }else time1 =new String( ii%24 );
??? ?????? x1 = step*100/10;
??? ?????? x2 = step*80/10;
??? ?????? x3 = x1+x2;
??? ?????? step++;
??? ????var add:Array = [{Time:time1+":"+time2,股票1:x1,股票2:x2,股票3:x3}];
??? ????this.capbility.removeItemAt(0);
??? ????capbility.addItem(add[0]);
??? ??}
??]]>
?</mx:Script>
</mx:Application>

?

?

?

?

Flex 快捷键对一般开发者来说都非常有用，本文向大家简单介绍一下Flex 快捷键有哪些，以及它们的具体作用，希望本文的介绍能让你有所收获。
?
◆常用Flex 快捷键如下：

Ctrl-F11: 执行（Run）
F11: 除错（Debug）
Ctrl-Alt-Down: 重复目前所在编辑列（Repeat current line ）
Alt-Up: 移动本列，或选择列往上移动（Move line (or selection) up ）
Alt-Down: 移动本列，或选择列下往移动（Move line (or selection) down ）
Ctrl-Click: 移至定义区（Go to definition (=F3) ）

F3????????? 显示当前选中标签的类定义
Ctrl-D: 删除本行（Delete line ）
Alt-/: 文字自动完成（Word completion (cycles through possible matches)）
Ctrl-Up: 捲轴向上（Scroll up ）
Ctrl-Down: 捲轴向下（Scroll Down ）
Shift+F2??? 弹出帮助窗体，显示选中标签的上下文帮助
F1????????? 在IDE内显示上下文帮助
CTRL+0?????? 在代码视窗显示大纲
CTRL+SHIFT+C? 加注释
Ctrl+/：行注释
Ctrl+Shift+L： 所有快捷键提示

◆另外还有一些不怎么常用的Flex 快捷键。

1.) 打开类型 (Ctrl-Shift-T)* - 浏览工程中所有类型(AS 类/接口,MXML文件) ，可快速打开它们。

2.) 跳到定义处(F3/Ctrl-点击目标)* - 快速跳转到 (类型/变量/函数)定义处。

3.) 快速Outliner视图 (Ctrl-O)* - 以弹出窗口方式打开outline视图。

4.) 内容相关帮助 (在目标上按F1) - 在MXML标签，函数或类/接口上按F1会在帮助面板上显示相关帮助信息。

5.) 打开内容相关帮助 (Shift-F2) - 会弹出新窗口显示相关帮助信息。

6.) 跳到匹配的括号(Ctrl-Shift+P)* - 跳到相对应得括号处。

7.) 悬停在目标上 - 当你把鼠标停留在变量上，会显示变量类型，如果停留在函数上，则显示返回类型。

8.) 添加CDATA 块(Ctrl-Shift-C) -

9.) 事件类型提示(Ctrl-space) - addEventListener( 显示所有相关联的事件)

10.) 组织导入(Ctrl + Shift + O)*

?

<?xml version="1.0"?>
<!-- Simple example to demonstrate the ColumnChart and BarChart controls. -->
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml">

??? <mx:Script>
??????? <![CDATA[
?????????
??????
?????? import mx.collections.ArrayCollection;

??????? [Bindable]
? private var expensesAC: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 } ]);
???????? //定义数据源：Month表示数据个数，名字可以随便定义
??????? ]]>
??? </mx:Script>
? <mx:Style>???????
??????? BubbleChart { color:#000099; }、、定义气泡的样式
??? </mx:Style>
??? <mx:Panel title="ColumnChart and BarChart Controls Example"
??????? height="100%" width="100%" layout="horizontal">
??????? <mx:BubbleChart id="JBubber" showDataTips="true" dataProvider="{expensesAC}" width="635">

//showDataTips表示是否显示每一个气泡的详细信息
??????????? <mx:series>
??????????????? <mx:BubbleSeries displayName="Profix/Expenses/Amount" yField="Expenses" radiusField="Amount" xField="Profit"/>

//displayName表示显示详细信息的标题，xField表示显示的第一行数据，yField表示显示的第2行数据，radiusField表示气泡的大小
??????????? </mx:series>
??????? </mx:BubbleChart>
??????? <mx:Legend dataProvider="{JBubber}"/>

?????
??? </mx:Panel>
</mx:Application>

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" creationComplete="init()">
??? <mx:Script>
??????? <![CDATA[
??????? import mx.collections.ArrayCollection;
??????? import mx.collections.XMLListCollection;
??? import mx.controls.Alert;

???????
??????? [Bindable]//绑定数据源
??????? private var linechartArray:ArrayCollection = new ArrayCollection([
??????? {name:"1",value:300},
??????? {name:"2",value:500},
??????? {name:"3",
??????? {name:"4",value:200},
??????? {name:"5",value:800},
??????? {name:"6",value:100},
??????? {name:"7",
??????? {name:"8",value:700},
??????? {name:"9",value:200}
???????
???????
??????? ]);
??????
????? public function init():void{
?????? //对数据源添加第一项和最后一项以达到不覆盖的效果
??????????????? var foo:Object=new Object;
??????????????? this.linechartArray.addItemAt(foo,0);
??????????????? this.linechartArray.addItem(foo);
??????????????? }
??????? //隐藏竖轴label
??????? private function verticalHide(data:Object,field:String,index:Number):String {???????????
??????????? return "";?
??????? }?
???????
??????
??????? ]]>
??? </mx:Script>
???
??? <!--自定义线条的颜色 -->
??? <mx:SolidColor id="sc1" color="blue" alpha=".3"/>
??? <mx:SolidColor id="sc2" color="red" alpha=".3"/>
??? <mx:SolidColor id="sc3" color="green" alpha=".3"/>

??? <!--自定义笔触效果外框颜色 -->
??? <mx:Stroke id = "s1" color="blue" weight="2"/>
??? <mx:Stroke id = "s2" color="red" weight="2"/>
??? <mx:Stroke id = "s3" color="green" weight="2"/>
??? <mx:Stroke id="axisStroke" color="#884422" weight="8" alpha=".88" caps="square"/>
???
??? <!--=======================线型图===========================-->
??? <mx:LineChart id="linechart" height="312" width="889" paddingLeft="5" paddingRight="5"
??????? showDataTips="true" dataProvider="{linechartArray}">
??????? <!--背景线显示样式,此处采用竖直显示-->
??????? <mx:backgroundElements>
??????????? <mx:GridLines direction="vertical" horizontalChangeCount="2"
??????????????? verticalChangeCount="1"
????????????? />
??????? </mx:backgroundElements>???
??????????
??????? <!--水平轴的渲染-->
??????? <mx:horizontalAxisRenderers>
??????????? <mx:AxisRenderer? labelGap="3" textIndent="0" id="myAxisRenderer" placement="bottom" canDropLabels="true" axis="{a1}">
??????????????? <!--横轴轴线样式 cps是控制边缘形状的属性-->
??????????????? <mx:axisStroke>
??????????????????? <mx:Stroke color="red" weight="4"???? caps="round"/>
??????????????? </mx:axisStroke>
??????????????? <!--刻度样式-->
??????????????? <!--<mx:tickStroke>
??????????????????? <mx:Stroke color="blue" weight="3"/>
??????????????? </mx:tickStroke>-->
??????????? </mx:AxisRenderer>
???????? </mx:horizontalAxisRenderers>
????????
???????? <!--竖直轴的样式渲染 placement是显示位置的刻度线-->
???????? <mx:verticalAxisRenderers>
???????????? <mx:AxisRenderer axis="{a2}" labelGap="3" alpha="0" placement="left"
???????????????? showLine="true">?????????????????????
???????????? </mx:AxisRenderer>
???????? </mx:verticalAxisRenderers>
????????
???????? <!--竖直轴的控制-->
???????? <mx:verticalAxis>
????????? <mx:LinearAxis id="a2" labelFunction="verticalHide"
????????? minimum="0"? interval="10">
????????? </mx:LinearAxis>
???????? </mx:verticalAxis>
????????
???????? <!--水平轴的控制及填充值-->
???????? <mx:horizontalAxis? >
???????????? <mx:CategoryAxis id="a1" categoryField="name"? ticksBetweenLabels="false"/>
???????? </mx:horizontalAxis>??
????????
???????? <!--线型图序列-->
???? <!--???? <mx:secondSeries>

?????????????? <mx:LineSeries form="curve" xField="name" yField="value"/> ??????? </mx:secondSeries>--> ???????? <mx:series> ???????????? <mx:LineSeries yField="value" form="curve" displayName="value" lineStroke="{s3}"/> ???????? </mx:series> ??? </mx:LineChart> </mx:Application>