ArcGIS Server 开发指南：基于Flex和.NET(3)——Flex和Javascript交互完全详解

来源：互联网发布：山东网络电视台编辑：程序博客网时间：2024/05/22 08:22

1.Flex和Javascript交互

1）Flex导出单独的swf文件

在flashbuilder中的flex项目中，右击选择“属性”——选择左侧的“Flex构建路径”->"库路径(L)"——“组件集”选择Mx+spark(K)——“框架链接”选择“合并到代码中”——导出发行版即可在相应选择输出的文件夹中可以找到对应swf文件 ——需要注意的是swf拷贝到其他路径时打开会报安全沙箱错误，因为flash只允许本地连接和网络连接2种方式的一种，默认的是网络连接，更改路径时不允许本地连接所以报错。

2）在页面中嵌入swf文件

swfobject方式：

swfobject.embedSWF（"test.swf"，"swfid"， "300"， "120"， "9.0.0"）;

</script>

若是你只是嵌入一个Flash动画文件的画，上方的四句话都搞定了，下面我们介绍一下SwfObject嵌入flash的具体办法。

var flashvars = {

nameA:"hello"，

nameB:"world"

}

var params = {

menu:"false"，

allowFullscreen:"false"，

allowScriptAccess:"always"，

bgcolor:"＃ffffff"，

wmode:"window"

}

var attributes = {

id:"test"

}

swfobject.embedSWF（"swf/test.swf"，"altContent"， "100％"， "100％"， "9.0.0"， "swf/expressInstall.swf"， flashvars， params， attributes）;

</script>

<h1>FlashvarsDemo</h1>

<p><ahref="http://www.adobe.com/go/getflashplayer">安装最新的FlashPlayer</a></p>

</div>

具体介绍一下swfobject.embedSWF办法，该办法共须要10个参数：

　　swfUrl（String ，必须的）指定SWF的URL。

　　id（String ，必须的）指定将会被Flash内容调换的HTML元素的id。

　　width（String，必须的）指定SWF的宽。

　　height（String，必须的）指定SWF的高。

　　version（String，必须的）指定你公布的SWF对应的Flash Player版本（格局为：major.minor.release）。

　　expressInstallSwfurl（String，可选）指定express install SWF的URL并激活Adobe express install。

　　flashvars（ Object ，可选）用name:value对指定你的flashvars。

　　params（Object ，可选）用name:value对指定你的嵌套object元素的params。

　　Attributes（Object，可选）用name:value对指定object的属性。

　　callbackFn（JavaScript function，可选）定义一个在履行embedSWF办法后，嵌入flash成功或失败后都可以回调的js 函数

　　对于不须要的参数可以省略，然则若是某个参数不须要，请用 null 关键字占位，如：

　　swfobject.embedSWF（"swf/test.swf"，"altContent"， "100％"， "100％"， "9.0.0"， null， flashvars， params， attributes）;

　　swfobject.embedSWF办法里面的 expressInstallSwfurl 参数是一个Adobe供给的用于主动进级FlashPlyaer的一个swf文件，当客户端安装了FlashPlayer 6+ 的版本，又达不到 verison参数描述的版本时，swfobject就会在页面里面显示这个expressinstall.swf文件，它会提示你是否要主动进级FlashPlayer。别的，swfobject 还供给了两个检测FlashPlayer版本的办法：

　　swfobject.getFlashPlayerVersion（）

　　返回一个包含了已安装Flash Player首要版本（major:Number）、次要版本、minor:Number）、发行版本（release:Number）的JavaScript对象。

　　swfobject.hasFlashPlayerVersion（versionStr）

返回一个Boolean值，注解特定版本的Flash插件是否已被安装; 如：swfobject.hasFlashPlayerVersion（“9.0.124”）

古老且不合适W3C标准的嵌入体式格式：

<objectclassid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000"codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab＃version=7，0，0，0"width="550" height="400" id=“demo1"align="middle">

<paramname="allowScriptAccess" value="sameDomain" />

<paramname="movie" value="mymovie.swf" />

<paramname="quality" value="high" />

<paramname="bgcolor" value="＃ffffff" />

<embedsrc="mymovie.swf" quality="high" bgcolor="＃ffffff"width="550" height="400" name=“demo1"align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash"pluginspage="http://www.macromedia.com/go/getflashplayer" />

</object>

合适W3C 标准的嵌入体式格式：

<paramname="movie" value="swf/fp9.swf" />

<paramname="allowScriptAccess" value="always" />

<paramname="wmode" value="transparent" />

<paramname="allowFullscreen" value="true" />

<paramname="quality" value="high" />

<paramname="flashvars" value="text=这是flashvars传入的数据啊"/>

</object>

3）JavaScript与ActionScript通讯

1ActionScript调用JavaScript的方法用到ExternalInterface类的call方法

传递参数时

ExternalInterface.call(functionName:String,...arguments):

fuctionName:要调用的JavaScript函数名

arguments:参数，可选

不带参数的情况

JavaScript：function Show() { alert("I am a func!");}

ActionScript：//直接用一条语句调用ExternalInterface.call("Show");

带参数的情况

JavaScript：function Show(message) { alert(message);}

ActionScript：ExternalInterface.call("Show","I am a message fromAS");另外，也可以用getURL方法来调用

getURL("javascript:show('i am a message fromas)","_self");

获取参数时

ActionScript：

varparams:Object = ExternalInterface.call("flexParams");

if (params != null) {

var source:String = params.source as String;

var param2:String = params.param2 as String;

}

2 JavaScript调用ActionScript的方法

传递参数时

JavaScript：

//这个是通用的查找Flash的函数,IE下是object,而FF下是document

functionthisMovie(movieName)

{

if(navigator.appName.indexOf("Microsoft") != -1) {returnwindow[movieName];}

else { return document[movieName]; }

}

thisMovie("mmap").DrawPoint(x, y);;//JS调用swf中的函数

ActionScript：

ExternalInterface.addCallback( functionName:String,closure:Function):void

functionName:要注册的函数名

closure:对应的执行函数

ActionScript:ExternalInterface.addCallback("DrawPoint", DrawPoint);

private function DrawPoint (x:String, y:String):string{return x+y;}

返回参数时可用ExternalInterface.call(functionName:String,...arguments):

传递参数时还有2种方式

url传递参数，和html url传参一样，swf?param1=param1&param2=param2

FlashVars传递参数

varflashvars = {};

flashvars.source ="http://material.157you.com/material/767/dcf_enc.flv";

flashvars.param2 = "test";

swfobject.embedSWF(

"VideoPlayer.swf","flashContent",

"500","500",

swfVersionStr, xiSwfUrlStr,

flashvars, params, attributes);

或<param name="flashvars" value="source=http:&param2=test" />

两者在Flex中的获取方式为

if (parameters != null)

{

varsource:String = parameters.source as String;

varparam2:String = parameters.test as String;

}

例源码：

mxml文件

<?xmlversion="1.0" encoding="utf-8"?>

<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark"

xmlns:esri="http://www.esri.com/2008/ags" xmlns:Navigation="Tool.Navigation.*" xmlns:mapMeasure="Tool.mapMeasure.*"

xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955"creationComplete="application1_creationCompleteHandler(event)"

minHeight="600"xmlns:SoeTask="com.pis.soe.*">

<fx:Style source="defaults.css"/>

<fx:Script>

<![CDATA[

import com.esri.ags.FeatureSet;

import com.esri.ags.Graphic;

import com.esri.ags.events.GraphicEvent;

import com.esri.ags.events.LayerEvent;

import com.esri.ags.geometry.Extent;

import com.esri.ags.geometry.Geometry;

import com.esri.ags.geometry.MapPoint;

import com.esri.ags.geometry.Polygon;

import com.esri.ags.geometry.Polyline;

import com.esri.ags.layers.ArcGISDynamicMapServiceLayer;

import com.esri.ags.layers.GraphicsLayer;

import com.esri.ags.symbols.PictureMarkerSymbol;

import com.esri.ags.symbols.SimpleFillSymbol;

import com.esri.ags.symbols.SimpleLineSymbol;

import com.esri.ags.symbols.SimpleMarkerSymbol;

import com.esri.ags.tasks.supportClasses.Query;

import com.esri.ags.utils.GraphicUtil;

import com.esri.ags.utils.JSONUtil;

import com.pis.soe.*;

import flashx.textLayout.events.UpdateCompleteEvent;

import mx.collections.ArrayCollection;

import mx.controls.Alert;

import mx.events.FlexEvent;

import mx.events.ItemClickEvent;

import mx.rpc.AsyncResponder;

import mx.rpc.Fault;

import mx.rpc.events.FaultEvent;

import spark.primitives.Path;

private var graphicsLayer:GraphicsLayer;

[Bindable]

private varbaseLayer:SXGeoTileLayer

private var vec:String="vec";

private var img:String="img";

private var cva:String="cva";

private var mlayer:ArcGISDynamicMapServiceLayer;

private var pointsSOEArr:ArrayCollection=new ArrayCollection();

private var pointsArr:ArrayCollection;

protected function application1_creationCompleteHandler(event:FlexEvent):void

{

baseLayer = new SXGeoTileLayer()//天地图底图

baseLayer.layerType=vec;

var cvaLayer:SXGeoTileLayer =new SXGeoTileLayer()//天地图标注

cvaLayer.layerType=cva;

mlayer=new ArcGISDynamicMapServiceLayer("http://10.100.24.233:6080/arcgis/rest/services/Publish3/MapServer");

baseMap.addLayer(baseLayer);

baseMap.addLayer(cvaLayer);

baseMap.addLayer(mlayer);

mlayer.addEventListener(LayerEvent.UPDATE_END,updateEnd);

mapMeas.clearFunc=_clearFunc;

if(graphicsLayer==null)

{

graphicsLayer=new GraphicsLayer();

}

baseMap.addLayer(graphicsLayer);

if (parameters.hasOwnProperty("XMIN")&&parameters.hasOwnProperty("XMAX")&&parameters.hasOwnProperty("YMIN")&&parameters.hasOwnProperty("YMAX"))

{

var XMIN:String = parameters.XMINas String;

var XMAX:String = parameters.XMAXas String;

var YMIN:String = parameters.YMINas String;

var YMAX:String = parameters.YMAXas String;

baseMap.extent=newExtent(Number(XMIN),Number(YMIN),Number(XMAX),Number(YMAX));

}

if (parameters.hasOwnProperty("LEVEL"))

{

var LEVEL:String = parameters.LEVELas String;

baseMap.level=Number(LEVEL);

}

ExternalInterface.addCallback("DrawPointbyXY",DrawPointbyXYHandler);//注册JS回调,在JS中调用swf的函数

ExternalInterface.addCallback("DrawLinebyXY",DrawLinebyXYHandler);

//jsonString=JSONUtil.encode(JSONObject);

/* var jsonString:String="{'paths':[[116.28175001000022,37.16428666000019],[116.28176019000011,37.16428443000018],[116.28177682000012,37.1642811800001],[116.2817872600001,37.16427862000006],[116.28181300000006,37.16427640000006],[116.28183866000006,37.164274370000044],[116.28184903000022,37.16427145000017],[116.28185983000003,37.164270650000105],[116.28188249000016,37.164268910000146],[116.28218600000002,37.164230260000124],[116.28224152000018,37.16422211999998],[116.2822571700001,37.164224930000046],[116.28226703000018,37.16423822000007],[116.28241571000001,37.164994950000164],[116.28253792000021,37.16561895000012],[116.2826537100002,37.16619104],[116.28278190000015,37.16684816000003],[116.2829675500002,37.167816570000014],[116.28310295425013,37.168524173328876]],'spatialReference':{'wkid':4326}}";

DrawLinebyXYHandler(jsonString);*/

//varpointsJSON:String='[{"stationseries":"b9cf4986-d948-4740-83d9-c236e9f7a9a4","station":1000},{"stationseries":"b9cf4986-d948-4740-83d9-c236e9f7a9a4","station":5000}]';

//varpointsJSON:String='[{"lon":124.951478,"lat":48.34911905},{"lon":125.0274128,"lat":47.73568589}]';

//varpointsJSON:String='[{"beginstationseries":"b9cf4986-d948-4740-83d9-c236e9f7a9a4","beginstation":1000,"endstationseries":"b9cf4986-d948-4740-83d9-c236e9f7a9a4","endstation":2000}]';

//DrawLinebySOEHandler(pointsJSON);

ExternalInterface.addCallback("DrawPointsbyXY",DrawPointsbyXYHandler);

ExternalInterface.addCallback("DrawPointsbySOE",DrawPointsbySOEHandler);

ExternalInterface.addCallback("DrawLinebySOE",DrawLinebySOEHandler);

}

protected function updateEnd(event:LayerEvent):void

{

mlayer.removeEventListener(LayerEvent.UPDATE_END,updateEnd);

ExternalInterface.call("updataEnd","true");

}

private function _clearFunc():void

{

graphicsLayer.clear();

}

private function DrawLinebySOEHandler(pointsJSON:String):void

{

graphicsLayer.clear();

pointsSOEArr.removeAll();

if(pointsJSON!=null&&pointsJSON!="")

{

pointsArr= new ArrayCollection(JSONUtil.decode(pointsJSON)as Array);

for (var i:int = 0; i < pointsArr.length; i++)

{

var params:FindPostionSoeParameters=newFindPostionSoeParameters();

params.BeginSsEventID =pointsArr[i].beginstationseries; //站列

params.BeginStation = pointsArr[i].beginstation; //里程

params.EndSsEventID =pointsArr[i].endstationseries; //站列

params.EndStation = pointsArr[i].endstation; //里程

PositionTask.executeGetLinebySsStation(params);

}

private function DrawPointsbySOEHandler(pointsJSON:String):void

{

graphicsLayer.clear();

pointsSOEArr.removeAll();

if(pointsJSON!=null&&pointsJSON!="")

{

pointsArr= newArrayCollection(JSONUtil.decode(pointsJSON)as Array);

for (var i:int = 0; i < pointsArr.length; i++)

{

var params:FindPostionSoeParameters=newFindPostionSoeParameters();//给【入参】赋值

params.BeginSsEventID = pointsArr[i].stationseries; //站列

params.BeginStation = pointsArr[i].station; //里程

PositionTask.executeGetPointbySsStation(params);

}

private function DrawPointbyXYHandler(x:Number,y:Number):void

{

graphicsLayer.clear();

var mapPoint:MapPoint=new MapPoint(x,y);

mapPoint.spatialReference=baseMap.spatialReference;

var graphic:Graphic=new Graphic((mapPointasGeometry),smsIdentify);

graphicsLayer.add(graphic);

baseMap.centerAt(mapPoint);

}

private function DrawPointsbyXYHandler(points:String):void

{

graphicsLayer.clear();

/*varresultGraphics:Array=new Array();

varmJsonArr:Array=mJsonString.split("[");

for (var i:int = 2; i <mJsonArr.length; i++)

{

varmPointsArr:Array=mJsonArr[i].toString().split("]");

varmPointArr:Array=mPointsArr[0].toString().split(",");

varxponit:Number=Number(mPointArr[0]);

varyponit:Number=Number(mPointArr[1]);

var mapPoint:MapPoint=newMapPoint(xponit,yponit);

mapPoint.spatialReference=baseMap.spatialReference;

var graphic:Graphic=newGraphic((mapPoint as Geometry),smsIdentify);

resultGraphics.push(graphic);

graphicsLayer.add(graphic);

}

baseMap.extent=GraphicUtil.getGraphicsExtent(resultGraphics);*/

/*if(points!=null&&points!="")

{

varpointsArr:ArrayCollection=JSON.parse(points) as ArrayCollection;

var xArray:Array=new Array();

var yArray:Array=new Array();

var mapPointArr:Array=newArray();

for(vari:int=0;i<pointsArr.length;i++)

{

xArray.push(pointsArr[i].lon);

xArray.push(pointsArr[i].lat);

var mapPoint:MapPoint=newMapPoint(pointsArr[i].lon,pointsArr[i].lat);

var graphic:Graphic=newGraphic((mapPoint as Geometry),smsIdentify);

mapPointArr.push(mapPoint);

graphicsLayer.add(graphic);

}

baseMap.extent=GraphicUtil.getGraphicsExtent(mapPointArr);*/

if(points!=null&&points!="")

{

var pointsArr:ArrayCollection =new ArrayCollection(JSONUtil.decode(points)as Array);

var mapPointArr:Array=new Array();

for(var i:int=0;i<pointsArr.length;i++)

{

var mapPoint:MapPoint=new MapPoint(pointsArr[i].lon,pointsArr[i].lat);

var graphic:Graphic=new Graphic((mapPointasGeometry),smsIdentify);

mapPointArr.push(graphic);

graphicsLayer.add(graphic);

}

baseMap.extent=GraphicUtil.getGraphicsExtent(mapPointArr);

if (mapPointArr.length==1)

{

baseMap.centerAt(mapPointArr[0].geometry);

}

else

{

baseMap.extent=GraphicUtil.getGraphicsExtent(mapPointArr);

}

private function DrawLinebyXYHandler(points:String):void

{

graphicsLayer.clear();

/* var mJsonArr:Array=mJsonString.split("[");

var mapPoints:ArrayCollection=newArrayCollection();

for (var i:int = 2; i <mJsonArr.length; i++)

{

varmPointsArr:Array=mJsonArr[i].toString().split("]");

varmPointArr:Array=mPointsArr[0].toString().split(",");

varxponit:Number=Number(mPointArr[0]);

varyponit:Number=Number(mPointArr[1]);

var mapPoint:MapPoint=newMapPoint(xponit,yponit);

mapPoint.spatialReference=baseMap.spatialReference;

mapPoints.addItem(mapPoint);

}

var mapLine:Polyline=newPolyline();

mapLine.addPath(mapPoints.toArray());

var graphic:Graphic=newGraphic((mapLine as Geometry),new SimpleLineSymbol("solid",0x0328e7,0.8, 4));

baseMap.extent=mapLine.extent;

graphicsLayer.add(graphic);*/

if(points!=null&&points!="")

{

var pointsArr:ArrayCollection=JSON.parse(points)as ArrayCollection;

var xArray:Array=new Array();

var yArray:Array=new Array();

var mapPointArr:Array=new Array();

for(vari:int=0;i<pointsArr.length;i++)

{

xArray.push(pointsArr[i].lon);

xArray.push(pointsArr[i].lat);

var mapPoint:MapPoint=new MapPoint(pointsArr[i].lon,pointsArr[i].lat);

mapPointArr.push(mapPoint);

}

var mapLine:Polyline=new Polyline();

mapLine.addPath(mapPointArr.toArray());

var graphic:Graphic=new Graphic((mapLineas Geometry),new SimpleLineSymbol("solid",0x0328e7, 0.8,4));

baseMap.extent=mapLine.extent;

graphicsLayer.add(graphic);

}

private function OnPositionTaskComplete(event:FindPostionSoeEvent):void

{

varlc_SoeResult:FindPostionSoeResult = event.mPosSoeResult; //返回值

var g1:Graphic;

var gemotry:Geometry

if (lc_SoeResult.mPoint)

{

gemotry=lc_SoeResult.mPoint as Geometry;

g1=new Graphic(gemotry,smsIdentify);

}

else if (lc_SoeResult.mLine)

{

gemotry=lc_SoeResult.mLine as Geometry;

g1=new Graphic(gemotry,new SimpleLineSymbol("solid",0x0328e7, 0.8,4));

}

graphicsLayer.add(g1);

pointsSOEArr.addItem(g1);

if (lc_SoeResult.mPoint)

{

if (pointsArr.length==1)

{

baseMap.centerAt(lc_SoeResult.mPoint);

}

elseif(pointsSOEArr.length==pointsArr.length)

{

baseMap.extent=GraphicUtil.getGraphicsExtent(pointsSOEArr.toArray());

}

else if (lc_SoeResult.mLine)

{

baseMap.extent=lc_SoeResult.mLine.extent;

}

protected function esriService_faultHandler(event:FaultEvent):void

{

Alert.show(event.toString());

}

]]>

</fx:Script>

<fx:Declarations>

<esri:PictureMarkerSymbol id="smsIdentify" source="@Embed(source='Img/marker.swf')"width="20"height="20"/>

<SoeTask:FindPostionSoeTask id="PositionTask" url="http://10.100.24.233:6080/arcgis/rest/services/Publish2/MapServer/exts/FindPostionByLineRouteSOE"

executeComplete="OnPositionTaskComplete(event)"fault="esriService_faultHandler(event)"/>

</fx:Declarations>

<esri:Map id="baseMap" x="0" y="0" logoVisible="false" zoomSliderVisible="false">

<esri:extent>

<esri:Extent xmax="140" xmin="74" ymax="54" ymin="18"/>

</esri:extent>

</esri:Map>

</s:Application>

JSP文件

<%@ page language="java"import="java.util.*" pageEncoding="UTF-8"%>

String path = request.getContextPath();

String basePath =request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

<!DOCTYPE HTML PUBLIC "-//W3C//DTDHTML 4.01 Transitional//EN">

<html>

<head>

<title>My JSP 'index.jsp' starting page</title>

<metahttp-equiv="pragma" content="no-cache">

<metahttp-equiv="cache-control" content="no-cache">

<metahttp-equiv="expires" content="0">

<metahttp-equiv="keywords"content="keyword1,keyword2,keyword3">

<metahttp-equiv="description" content="This is my page">

<!--

<linkrel="stylesheet" type="text/css"href="styles.css">

-->

<scripttype="text/javascript"src="swfobject.js"></script>

<scripttype="text/javascript">

var swfFinish=false;

// For version detection, set to min. required Flash Player version, or0 (or 0.0.0), for no version detection.

var swfVersionStr = "11.1.0";

// To use express install, set to playerProductInstall.swf, otherwisethe empty string.

var xiSwfUrlStr = "mmap/playerProductInstall.swf";

var flashvars = {};

var params = {};

params.quality = "high";

params.bgcolor = "#ffffff";

params.allowscriptaccess = "sameDomain";

params.allowfullscreen = "true";

var wmode = swfobject.getQueryParamValue("wmode");

if (wmode)

{

params.wmode = wmode;

}

var attributes = {};

attributes.id = "mmap";

attributes.name = "mmap";

attributes.align = "middle";

var callback = function (e){

//Only execute if SWFObject embed was successful

if(!e.success || !e.ref){ return false; }

swfLoadEvent(function(){

swfFinish=true;

},e);

};

function swfLoadEvent(fn,e){

//Ensure fn is a valid function

if(typeof fn !== "function"){return false; }

//This timeout ensures we don't try toaccess PercentLoaded too soon

var initialTimeout = setTimeout(function(){

//Ensure Flash Player's PercentLoadedmethod is available and returns a value

if(typeof e.ref.PercentLoaded !=="undefined" && e.ref.PercentLoaded()){

//Set up a timer to periodicallycheck value of PercentLoaded

var loadCheckInterval =setInterval(function (){

//Once value == 100 (fullyloaded) we can do whatever we want

//alert(e.ref.PercentLoaded());

if(e.ref.PercentLoaded() ===100){

//Execute function

fn();

//Clear timer

clearInterval(loadCheckInterval);

}

}, 1500);

}

}, 200);

}

varurl="mmap/mmap.swf?ID=123456&XMIN=74&XMAX=140&YMIN=18&YMAX=54&LEVEL=13";

swfobject.embedSWF(

url, "flashContent",

"100%","100%",

swfVersionStr, xiSwfUrlStr,

flashvars, params,attributes,callback);

// JavaScript enabled so display the flashContent div in case it is notreplaced with a swf object.

swfobject.createCSS("#flashContent","display:block;text-align:left;");

if (swfobject.ua.ie && swfobject.ua.win)

{

swfobject.addLoadEvent(

function()

{

var app =swfobject.getObjectById("mmap");

if (app)

{

try{

app.focus();

} catch(error) {

}

);

}

</script>

</head>

<body>

<inputtype="button" onclick="drawpoint()" value="单点定位"/>

<inputtype="button" onclick="drawpoints()" value="多点"/>

<inputtype="button" onclick="drawpointsSOE()"value="多点SOE" />

<inputtype="button" onclick="drawline()" value="线段"/>

<p>

To view this page ensure thatAdobe Flash Player version

11.1.0 or greater is installed.

</p>

var pageHost =((document.location.protocol == "https:") ? "https://" :"http://");

document.write("<ahref='http://www.adobe.com/go/getflashplayer'><img src='"

+ pageHost +"www.adobe.com/images/shared/download_buttons/get_flash_player.gif'alt='Get Adobe Flash player' /></a>" );

</script>

</div>

<paramname="movie" value="mmap.swf" />

<paramname="quality" value="high" />

<paramname="bgcolor" value="#ffffff" />

<paramname="allowScriptAccess" value="sameDomain" />

<paramname="allowFullScreen" value="true" />

<objecttype="application/x-shockwave-flash" data="mmap.swf"width="100%" height="100%">

<paramname="quality" value="high" />

<paramname="bgcolor" value="#ffffff" />

<paramname="allowScriptAccess" value="sameDomain" />

<paramname="allowFullScreen" value="true" />

<p>

Either scripts andactive content are not permitted to run or Adobe Flash Player version

11.1.0 or greater isnot installed.

</p>

<ahref="http://www.adobe.com/go/getflashplayer">

<imgsrc="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif"alt="Get Adobe Flash Player" />

</a>

</object>

</object>

</noscript>

//这个是通用的查找Flash的函数,IE下是object,而FF下是document

functionthisMovie(movieName)

{

if(navigator.appName.indexOf("Microsoft") != -1) {returnwindow[movieName];}

else{ return document[movieName]; }

}

//获取初始化参数

functiondrawpoint() {

varxobj = document.getElementById("xpoint");

varyobj = document.getElementById("ypoint");

varx=xobj.value;

vary=yobj.value;

//thisMovie("mmap").DrawPoint(x,y);;//JS调用swf中的函数

var obj =document.getElementById('mmap');//这种方式调用也行

obj.DrawPointbyXY(x,y);

}

functiondrawpoints() {

//varjsonString="{'paths':[[116.28175001000022,37.16428666000019],[116.28176019000011,37.16428443000018],[116.28177682000012,37.1642811800001],[116.2817872600001,37.16427862000006],[116.28181300000006,37.16427640000006],[116.28183866000006,37.164274370000044],[116.28184903000022,37.16427145000017],[116.28185983000003,37.164270650000105],[116.28188249000016,37.164268910000146],[116.28218600000002,37.164230260000124],[116.28224152000018,37.16422211999998],[116.2822571700001,37.164224930000046],[116.28226703000018,37.16423822000007],[116.28241571000001,37.164994950000164],[116.28253792000021,37.16561895000012],[116.2826537100002,37.16619104],[116.28278190000015,37.16684816000003],[116.2829675500002,37.167816570000014],[116.28310295425013,37.168524173328876]],'spatialReference':{'wkid':4326}}";

varjsonString="[{\"lon\":124.951478,\"lat\":48.34911905},{\"lon\":125.0274128,\"lat\":47.73568589}]";

thisMovie("mmap").DrawPointsbyXY(jsonString);//JS调用swf中的函数

}

functiondrawpointsSOE() {

varjsonString="[{\"stationseries\":\"b9cf4986-d948-4740-83d9-c236e9f7a9a4\",\"station\":1000},{\"stationseries\":\"b9cf4986-d948-4740-83d9-c236e9f7a9a4\",\"station\":5000}]";

//thisMovie("mmap").DrawPointsbySOE(jsonString);//JS调用swf中的函数

varobj = document.getElementById('mmap');//这种方式调用也行

obj.DrawPointsbySOE(jsonString);

}

functiondrawline() {

varjsonString="[{\"beginstationseries\":\"b9cf4986-d948-4740-83d9-c236e9f7a9a4\",\"beginstation\":1000,\"endstationseries\":\"b9cf4986-d948-4740-83d9-c236e9f7a9a4\",\"endstation\":2000}]";

thisMovie("mmap").DrawLinebySOE(jsonString);//JS调用swf中的函数

}

functionupdataEnd(message) {

try {

alert(message);

}

catch (e) {

alert(e.message);

}

</script>

</body>

</html>

2. 例Flexviewer和Javascript交互读取文件夹下所有文件并交互:

Index.template源码：

<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!--

Smart developers always View Source.

This application was built using Adobe Flex, an open sourceframework

for building rich Internet applications that get delivered via the

Flash Player or to desktops via Adobe AIR.

Learn more about Flex at http://flex.org

// -->

<head>

<title>${title}</title>

<!-- Include CSS to eliminate any default margins/padding and set theheight of thehtml element and

the body element to 100%, because Firefox, or any Geckobased browser, interprets percentage as

the percentage of the height of its parent container, which has to beset explicitly. Fix for

Firefox 3.6 focus border issues. Initially, don't display flashContentdiv so it won't show

if JavaScript disabled.

-->

html, body { height:100%;}

body { margin:0; padding:0; overflow:auto; text-align:center;

background-color: ${bgcolor};}

object:focus { outline:none; }

#flashContent { display:none; }

</style>

<!-- BEGIN Browser History required section ${useBrowserHistory}>

<!${useBrowserHistory} END Browser History required section-->

// For version detection, set to min. required Flash Playerversion, or 0 (or 0.0.0), for no version detection.

var swfVersionStr ="${version_major}.${version_minor}.${version_revision}";

// To use express install, set to playerProductInstall.swf, otherwisethe empty string.

var xiSwfUrlStr = "${expressInstallSwf}";

var flashvars = {};

var params = {};

params.quality = "high";

params.bgcolor = "${bgcolor}";

params.allowscriptaccess = "sameDomain";

params.allowfullscreen = "true";

var attributes = {};

attributes.id = "${application}";

attributes.name = "${application}";

attributes.align = "middle";

swfobject.embedSWF(

"${swf}.swf","flashContent",

"${width}","${height}",

swfVersionStr, xiSwfUrlStr,

flashvars, params,attributes);

// JavaScript enabled so display the flashContent div in case itis not replaced with aswf object.

swfobject.createCSS("#flashContent","display:block;text-align:left;");

</script>

varrequiredMajorVersion = 9;

varrequiredMinorVersion = 0;

varrequiredRevision = 28;

//关键代码

functionBrowser()

{

document.getElementById("fileInput").click();

}

functionOnFileChange()

{

thisMovie("test2").OnFileChange(document.getElementById("fileInput").value);

}

functionthisMovie(movieName)

{

if(navigator.appName.indexOf("Microsoft") != -1) {returnwindow[movieName];}

else{ return document[movieName]; }

}

//批量导入

/***

path 要显示值的对象id

****/

function browseFolder(path) {

try {

var Message ="\u8bf7\u9009\u62e9\u6587\u4ef6\u5939"; //选择框提示信息

var Shell = newActiveXObject("Shell.Application");

var Folder =Shell.BrowseForFolder(0, Message, 64, 17); //起始目录为：我的电脑

//var Folder =Shell.BrowseForFolder(0,Message,0); //起始目录为：桌面

if (Folder != null) {

Folder = Folder.items(); // 返回 FolderItems 对象

Folder = Folder.item(); // 返回 Folderitem 对象

Folder = Folder.Path; // 返回路径

ShowFolderFileList(Folder);

if (Folder.charAt(Folder.length- 1) != "\\") {

Folder = Folder +"\\";

}

//document.getElementById(path).value = Folder;

return Folder;

}

catch (e) {

alert(e.message);

}

function ShowFolderFileList(folderspec){

var fso, f, fc,fc1,m;

fso = newActiveXObject("Scripting.FileSystemObject");

f = fso.GetFolder(folderspec);

fc1 = new Enumerator(f.SubFolders);

m = "";

for (; !fc1.atEnd(); fc1.moveNext()) {

m = fc1.item();

ShowFolderFileList1(m.Path);

}

return (m);

}

function ShowFolderFileList1(folderspec){

var fso, f, fc,f1, s,j;

fso = newActiveXObject("Scripting.FileSystemObject");

f = fso.GetFolder(folderspec);

fc = new Enumerator(f.files);

s = "";

j += folderspec;

for (; !fc.atEnd(); fc.moveNext()) {

s = fc.item();

if (s.Type == "文本文档") {

f1 = fso.opentextfile(s, 1, false);

while (!f1.AtEndOfStream) {

j += f1.Readline();

}

f1.close();

//document.write(j);

}

thisMovie("test3").ShowFolderFileList1(j);

return (j);

}

</script>

</head>

<body>

<inputtype="text" style="display:none" name="path"/>

<inputtype="button" style="display:none" onclick="browseFolder('path')" value="选择生成路径" />

<!-- SWFObject's dynamic embed method replaces this alternative HTMLcontent with Flash content when enough

JavaScript and Flash plug-insupport is available. The div is initially hidden so that it doesn'tshow

when JavaScript is disabled.

-->

<p>

To view this page ensure thatAdobe Flash Player version

${version_major}.${version_minor}.${version_revision} or greater isinstalled.

</p>

var pageHost =((document.location.protocol == "https:") ?"https://" : "http://");

document.write("<a href='http://www.adobe.com/go/getflashplayer'><imgsrc='"

+ pageHost +"www.adobe.com/images/shared/download_buttons/get_flash_player.gif'alt='GetAdobe Flash player' /></a>" );

</script>

</div>

<paramname="movie" value="${swf}.swf" />

<paramname="quality" value="high" />

<paramname="allowScriptAccess" value="sameDomain" />

<paramname="allowFullScreen" value="true" />

<objecttype="application/x-shockwave-flash" data="${swf}.swf"width="${width}" height="${height}">

<paramname="quality" value="high" />

<paramname="allowScriptAccess" value="sameDomain" />

<paramname="allowFullScreen" value="true" />

<p>

Either scripts andactive content are not permitted to run or Adobe Flash Player version

${version_major}.${version_minor}.${version_revision} or greater is notinstalled.

</p>

</a>

</object>

</object>

</noscript>

</body>

</html>

Flex端代码：

<?xml version="1.0"encoding="utf-8"?>

<s:Applicationxmlns:fx="http://ns.adobe.com/mxml/2009"

xmlns:s="library://ns.adobe.com/flex/spark" creationComplete="application1_creationCompleteHandler(event)"

xmlns:mx="library://ns.adobe.com/flex/mx"minWidth="955" minHeight="600"

xmlns:net="flash.net.*">

<fx:Script>

<![CDATA[

importmx.collections.ArrayCollection;

importmx.controls.Alert;

importmx.events.FlexEvent;

[Bindable]

privatevar arrColl:ArrayCollection =new ArrayCollection();

protectedfunction application1_creationCompleteHandler(event:FlexEvent):void

{

//TODO Auto-generated method stub

flash.system.System.useCodePage=true;

ExternalInterface.addCallback("OnFileChange",frSelectHandler);//注册JS回调

ExternalInterface.addCallback("ShowFolderFileList1",frSelectHandler);//注册JS回调

}

privatefunction mouseClickHandler(event:MouseEvent):void

{

ExternalInterface.call("Browser");//调用JS中Browser函数

}

privatefunction frSelectHandler(path:String):void

{

//imgTest.source= path;

varmystr:String=path;

oviewResult.text+="第"+"个地块"+"\n";

//tt.text=mystr;

try

{

if(mystr)

{

varmyPattern:RegExp =/\r\n/gi;//全局匹配回车新行

varresult:ArrayCollection=new ArrayCollection();

result.source=mystr.split(myPattern);

for(vari:Number=0;i<result.length;i++)

{

if(!result[i])result.removeItemAt(i);//去掉文件末尾的空行

}

//creatPolygonFromText(result);//从text生成polygon

//if(polygonToAdd)oviewFeature(polygonToAdd);//在缩略图中显示

}

foreach(var str:Stringin result)

{

oviewResult.text+=str+"\n";

}

//showInMap.enabled=true;

}

catch(e:*) {

//trace(e);

}

privatefunction btn_click(evt:MouseEvent):void

{

vararr:Array = [];

//arr.push(newFileFilter("Images", "*.jpg;*.png"));

arr.push(newFileFilter("Text Files (*.txt)","*.txt"));

fileReferenceList.browse(arr);

}

privatevar j:int;

privatefunction fileReference_select(evt:Event):void

{

//for(var j:int = 0; j < fileReferenceList.fileList.length; j++)

j=0;

chaxun();

}

privatefunction completeLoadFile1(e:Event):void

{

varmystr:String=fileReferenceList.fileList[0].data.toString();

//tt.text=mystr;

try

{

if(mystr)

{

varmyPattern:RegExp =/\r\n/gi;//全局匹配回车新行

varresult:ArrayCollection=new ArrayCollection();

result.source=mystr.split(myPattern);

for(vari:Number=0;i<result.length;i++)

{

if(!result[i])result.removeItemAt(i);//去掉文件末尾的空行

}

//creatPolygonFromText(result);//从text生成polygon

//if(polygonToAdd)oviewFeature(polygonToAdd);//在缩略图中显示

}

foreach(var str:Stringin result)

{

oviewResult.text+=str+"\n";

}

//showInMap.enabled=true;

}

catch(e:*) {

//trace(e);

}

//Alert.show(mystr);

/*var loader:Loader = new Loader();

loader.contentLoaderInfo.addEventListener(Event.COMPLETE,function():void

{

arrColl.addItem(Bitmap(loader.content));

});

loader.loadBytes(e.target.data);*/

}

privatefunction chaxun():void

{

if (j <fileReferenceList.fileList.length)

{

fileReferenceList.fileList[j].addEventListener(Event.COMPLETE,completeLoadFile);

fileReferenceList.fileList[j].load();

functioncompleteLoadFile(e:Event):void

{

varmystr:String=fileReferenceList.fileList[j].data.toString();

//tt.text=mystr;

try

{

if(mystr)

{

varmyPattern:RegExp = /\r\n/gi; //全局匹配回车新行

varresult:ArrayCollection= new ArrayCollection();

result.source=mystr.split(myPattern);

for(vari:Number=0;i<result.length;i++)

{

if(!result[i])result.removeItemAt(i);//去掉文件末尾的空行

}

//creatPolygonFromText(result);//从text生成polygon

//if(polygonToAdd)oviewFeature(polygonToAdd);//在缩略图中显示

}

oviewResult.text+="第"+(j+1)+"个地块"+"\n";

foreach(var str:Stringin result)

{

oviewResult.text+=str+"\n";

}

//showInMap.enabled=true;

}

catch(e:*) {

//trace(e);

}

//Alert.show(mystr);

/*var loader:Loader = new Loader();

loader.contentLoaderInfo.addEventListener(Event.COMPLETE,function():void

{

arrColl.addItem(Bitmap(loader.content));

});

loader.loadBytes(e.target.data);*/

j++;

chaxun();

}

protectedfunction mouseClickHandler1(event:MouseEvent):void

{

ExternalInterface.call("browseFolder");//调用JS中函数

}

]]>

</fx:Script>

<fx:Declarations>

<net:FileReferenceListid="fileReferenceList"

select="fileReference_select(event);"/>

</fx:Declarations>

<s:TextAreaid="oviewResult" x="0" y="15"width="355" height="330" editable="false"/>

<mx:Panelid="panel"

layout="absolute"

horizontalCenter="123"

verticalCenter="-52"

width="410"

height="300">

<mx:TileListid="tileList"

dataProvider="{arrColl}"

width="257"

height="50"

verticalScrollPolicy="on"

dragEnabled="true"

x="93"

y="19">

<mx:itemRenderer>

<fx:Component>

<mx:VBox>

<mx:Imagewidth="80"

height="80"

source="{data}"/>

</mx:VBox>

</fx:Component>

</mx:itemRenderer>

</mx:TileList>

<mx:Buttonlabel="浏览"

click="btn_click(event);"

width="73"

height="34"

fontSize="12"

x="-1"

y="19"/>

<s:TextAreaid="tt" x="60" y="74" width="290"height="183"/>

</mx:Panel>

<mx:Buttonid="btnBrowser" x="10" y="10"click="mouseClickHandler(event)" label="Button" />

<mx:Imageid="imgTest" x="10" y="50"/>

<s:Buttonx="51" y="432" id="pldr"click="mouseClickHandler1(event)" label="批量导入"/>

</s:Application>

0 0