<?xml version="1.0"?>
<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" creationComplete="initApp()">
<fx:Script>
<![CDATA[
import flash.events.TimerEvent;
import flash.utils.Timer;
import mx.collections.ArrayCollection;
import mx.controls.Alert;
import mx.rpc.Fault;
import mx.rpc.events.FaultEvent;
import mx.rpc.events.ResultEvent;
import mx.rpc.http.mxml.HTTPService;
import mx.controls.Alert;
import mx.core.FlexGlobals;
//定義一個XML類實例
[Bindable]
public var xml:XML;
[Bindable]
private var expensesAC:ArrayCollection ;
public static var viewXMLList:XMLList=new XMLList();
// 用於鏈接後臺servlet
private var httpService : HTTPService;
//private var externalVar : ExternalInterface;
//本函數用於構建與後臺jsp鏈接的方式和url
private function setHttpService(e:Event):void{
//獲取頁面的參數值:serverIp
var serverIp : Object = FlexGlobals.topLevelApplication.parameters.serverIp;
httpService = new HTTPService();
httpService.method = "GET";
//Alert.show(serverIp.toString());
httpService.url = "http://" + serverIp.toString() + ":8080/ALEConsole/CreateLineChartServlet";
//Alert.show( "http://" + serverIp.toString() + ":8080/ALEConsole/CreateLineChartServlet");
httpService.addEventListener(ResultEvent.RESULT,resultHandler);
httpService.send();
}
//結果處理
private function resultHandler(event:ResultEvent):void{
expensesAC = event.result.datas.data;
}
//應用程序初始化處理函數
public function initApp():void
{
//啓動時執行請求
//setHttpService();
//這裏用的Timer定時
var timer: Timer = new Timer(1000);
timer.addEventListener(TimerEvent.TIMER, setHttpService);
timer.start();
}
]]>
</fx:Script>
<fx:Declarations>
<mx:SolidColorStroke id = "s1" color="red" weight="1"/>
</fx:Declarations>
<mx:Panel title="系統吞吐量"
height="100%" width="100%" layout="horizontal" maxHeight="300" maxWidth="800" paddingLeft="10">
<mx:LineChart id="linechart" height="100%" width="100%"
showDataTips="true" dataProvider="{expensesAC}" paddingLeft="10">
<!--用來定義x軸-->
<mx:horizontalAxis>
<mx:CategoryAxis id="hAxis" categoryField="date" title="讀取時間" />
</mx:horizontalAxis>
<!--定義一組渲染X軸的特效-->
<mx:horizontalAxisRenderers>
<mx:AxisRenderer axis="{hAxis}" placement="bottom" />
</mx:horizontalAxisRenderers>
<!--Y軸,同x軸-->
<mx:verticalAxis>
<mx:LinearAxis id="vAxis" baseAtZero="false" interval="1" title="識讀器實時數量" />
</mx:verticalAxis>
<mx:verticalAxisRenderers>
<mx:AxisRenderer axis="{vAxis}" styleName="linedNumericAxis" x="10"/>
</mx:verticalAxisRenderers>
<mx:series>
<!--其縱座標的數據是根據yFiled中的數據動態生成的-->
<mx:LineSeries yField="num" form="curve" lineStroke="{s1}" />
</mx:series>
</mx:LineChart>
<!--添加圖例,也就是說明圖形的某個線條的顏色和做用的實例,相似於地圖的實例-->
<mx:Legend dataProvider="{linechart}" height="57"/>
</mx:Panel>
</s:Application>
個人flex工程名:LineChart,所以在本段代碼構建完成後,會產生一個LineChart.html.將bin-Debug中的全部文件拷貝到
web 的相應目錄下。修改Linechart.html爲jsp。在該文件中:
<script type="text/javascript">
<!-- For version detection, set to min. required Flash Player version, or 0 (or 0.0.0), for no version detection. -->
var swfVersionStr = "10.0.0";
<!-- To use express install, set to playerProductInstall.swf, otherwise the empty string. -->
var xiSwfUrlStr = "playerProductInstall.swf";
var flashvars = {"serverIp":"${pageContext.request.serverName}"};
var params = {};
params.quality = "high";
params.bgcolor = "#ffffff";
params.allowscriptaccess = "sameDomain";
params.allowfullscreen = "true";
var attributes = {};
attributes.id = "LineChart";
attributes.name = "LineChart";
attributes.align = "middle";
swfobject.embedSWF(
"LineChart.swf", "flashContent",
"100%", "100%",
swfVersionStr, xiSwfUrlStr,
flashvars, params, attributes);
<!-- JavaScript enabled so display the flashContent div in case it is not replaced with a swf object. -->
swfobject.createCSS("#flashContent", "display:block;text-align:left;");
</script>
在該段javascript代碼中:
var flashvars = {"serverIp":"${pageContext.request.serverName}"};
這段代碼是咱們向flex傳輸參數的位置,其爲鍵值對的方式存在。
/獲取頁面的參數值:serverIp
var serverIp : Object = FlexGlobals.topLevelApplication.parameters.serverIp;
相應的使用上面那句獲取傳輸進來的參數