空间管理您的位置: 3sNews.Net——3S社区&资讯平台 » my name is barry » 日志

arcgis api for flex 开发入门（九）webservices 的使用

上一篇 / 下一篇 2008-10-18 12:03:45 / 个人分类：mushup

arcgis api for flex 开发入门（九）webservices 的使用
flex 本身对webservices有着良好的支持，我们可以调用互联网上的各种

webservices来结合esri 的map 做出自己想要的东西
xE"\4P jw z$l2c2Gf0我们就拿现在比较流行的天气预报来做例子，我们要实现的目标就是通过

webservices查询到武汉的天气情况，然后使用infowindow 显示到esri 的map上

，在讲解过程中，我们会重点解释infowindow 的用法。
现在提供天气预报的webservices很多，我们选用

http://www.webxml.com.cn/WebServices/WeatherWebService.asmx?
来进行天气的查询。
VCLxP"}O ^6d5`0那么，在flex中如何使用webservices呢？
$]%[{K^'W0N0只要使用 <mx:WebService>标签创建一个WebService就可以了，id唯一标识这个

webservice，wsdl指向提供webservice的地址。
<mx:WebService id="weatherWS"

wsdl="http://www.webxml.com.cn/WebServices/WeatherWebService.asmx?WSDL"

showBusyCursor="true"/>
nP.C?CO-_5Cu'S+K0我们直接在application 创建完成的时候调用这个 webservice，得到结果后直接

显示到map上。
private function Init():void
{
2\3jg)jU3vB0 weatherWS.addEventListener(ResultEvent.RESULT,

WSGetWeatherResult);
          weatherWS.getWeatherbyCityName("武汉");
e8lvHn4G$Z7u0}
private function WSGetWeatherResult(event:ResultEvent):void
          {
          weatherWS.removeEventListener

(ResultEvent.RESULT,WSGetWeatherResult);
L!zf B2L%I Q|$N0 var arrC:ArrayCollection =event.result as

ArrayCollection;
r"pt&^k)lXW0          if(arrC.length > 0)
m"Q5ed3m:K'N0          {
             var str:String = arrC.getItemAt(0).toString();
8F9T%A+rH%FEO0        //    var infWd :InfoWindow = new InfoWindow(EsriMap);
.myQG-jIr0              var str2:String = arrC.getItemAt(1).toString();
             myMap.infoWindow.title= str+"."+str2;
m_'[+EpJ^0b0             var vbox :VBox = new VBox();
K*U#H&^;OD0             var vbox2 :VBox = new VBox();
             var hbox :HBox = new HBox();
$l?A:rhO!V cL0             var canvas:Canvas = new Canvas();
;}N Bd:M][*fh/T&r0             var path:String = "assets\\weather\\";
g9W k3Cp:Sbd:k8[,k0             var img1 :Image = new Image;
             img1.load(path+arrC.getItemAt(8).toString());
,bkt5P DJC0             hbox.addChild(img1);
~R5y7xF0             var img2 :Image = new Image;
5d?0H*ki^&{T0             img2.load(path+arrC.getItemAt(9).toString());
             hbox.addChild(img2);
R?*F3w!Q-F6R0

             var txtTem :Text = new Text();
2l0cB w,w/|0t;c^0             txtTem.text = arrC.getItemAt(5).toString();
             var txtWea :Text = new Text();
             txtWea.text = arrC.getItemAt(6).toString();
ybkj:F;b!L|0             var txtWind :Text = new Text();
             txtWind.text = arrC.getItemAt(7).toString();
4F9|r]aF0             vbox.addChild(txtTem);
             vbox.addChild(txtWea);
GzS5OL%p(] u6O0             vbox.addChild(txtWind);
:Nu#er2WTd0             vbox2.addChild(hbox);
wg};{5B0             vbox2.addChild(vbox);
             canvas.addChild(vbox2);

             myMap.infoWindow.content = canvas;
Pj+]m$c[6v U0             var mapPnt2:MapPoint = new MapPoint

(114.1547298,30.5127677);
myMap.infoWindow.show(mapPnt2);
myMap.centerAt(mapPnt2);

a6c8qBC:\"n0          }
          }

设置infoWindow有两点需要注意，一是infoWindow不需要自己new一个，只需要把

你要显示的内容赋值给myMap.infoWindow，二是显示的时候只需要调用

myMap.infoWindow.show(mapPnt2);就可以了，把你想显示的位置告诉他。
J:`U ^B#q0效果：

Flash:demo

代码： '^hP_Fr0<?xml version="1.0" encoding="utf-8"?> '|$r(v9_Q eas0<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" v~&~]%SDA'W0 pageTitle="Service Area"3sNews.Net——3S社区&资讯平台/F%^J!l%mO)w[~2t xmlns:esri="http://www.esri.com/2008/ags" &D:c1|8U5Nl6\q)F0 layout="absolute"3sNews.Net——3S社区&资讯平台;VZ GL2z/Cc creationComplete="Init()" 1Vr,j`+V4N)zJQ _0> ;y-po+^#n0 <mx:Script> K(noGD5ON.h_0 <![CDATA[ \s5H7x M"|0 import mx.containers.HBox;3sNews.Net——3S社区&资讯平台`GL:Br$T3G-hSN Y import mx.containers.VBox;3sNews.Net——3S社区&资讯平台pd8J+J},y2@$`P(f2Z` import mx.controls.Image; O0tv5K4~o0 import mx.rpc.events.ResultEvent;3sNews.Net——3S社区&资讯平台)~a$a~4v `H //导入flash的命名空间3sNews.Net——3S社区&资讯平台oV,N S3DEn-V0s+] import mx.collections.ArrayCollection;3sNews.Net——3S社区&资讯平台:e*{O2A_ import mx.controls.Alert; 3sNews.Net——3S社区&资讯平台+H/L7\E:C)t-k~ import mx.controls.Button; a j$v3s+M T}H0 import mx.rpc.AsyncResponder;3sNews.Net——3S社区&资讯平台;^s^;z&Ws` import flash.geom.Point;3sNews.Net——3S社区&资讯平台T ?g0{6BYd#y import mx.rpc.events.FaultEvent;3sNews.Net——3S社区&资讯平台`$gg#k8fW}/h Bn import mx.printing.FlexPrintJobScaleType; !D}?vD0 import mx.printing.FlexPrintJob; ,h)OQqg[Tq0 import mx.rpc.soap.mxml.Operation; 3lT6L"w,H6B0 import mx.containers.Canvas;3sNews.Net——3S社区&资讯平台h[p*[0F{~$~F_ import flash.text.*; #GaF ip hG$\MQr0 import mx.controls.Text;3sNews.Net——3S社区&资讯平台!x.b AZ o!Rev^t yIUT/Y3l!x)`%m,{ [#|M0 L6|w4D1jcE0 //导入esri flex api3sNews.Net——3S社区&资讯平台,q"E0C7KJJ5^5Y import com.esri.ags.geometry.MapPoint; Jj:kG$qwS{0 import com.esri.ags.Graphic; 1K cL&MS;ut-R"_y)L0 import com.esri.ags.events.DrawEvent; 3sNews.Net——3S社区&资讯平台YiSge*]f import com.esri.ags.events.ExtentEvent; :p*Hptr%qu`0 import com.esri.ags.SpatialReference; 1E Iz,E&]h{7l1_0 import com.esri.ags.layers.GraphicsLayer;3sNews.Net——3S社区&资讯平台/X!G!oH"XzZ5gSa import com.esri.ags.*;3sNews.Net——3S社区&资讯平台AxQ4zL!\ import com.esri.ags.InfoWindow; 0aO9cBw+_1l$?E%_0 import com.esri.ags.InfoTemplate; $aK8_?1u.Q2];@"e0 private function Init():void b%u5a{Wj0 { nL(j%m3r?0 weatherWS.addEventListener(ResultEvent.RESULT, WSGetWeatherResult); O6W2}c:p ao0 weatherWS.getWeatherbyCityName("武汉"); vs)b2s$VS0 } ~){^2xB_m0 private function WSGetWeatherResult (event:ResultEvent):void i9_1}1h1Y$xj0 {3sNews.Net——3S社区&资讯平台&Kt/nkj7UA-? weatherWS.removeEventListener (ResultEvent.RESULT,WSGetWeatherResult); 4lp }J I-kwar0 var arrC:ArrayCollection =event.result as ArrayCollection; (?|)n"PmZo|0 if(arrC.length > 0) :k)QK[)Y)A%Cq0 { CZ8b"FW&]0 var str:String = arrC.getItemAt(0).toString();3sNews.Net——3S社区&资讯平台)P)J9h,?2l0q2g // var infWd :InfoWindow = new InfoWindow(EsriMap); D?WM^hO4n_I1k0 var str2:String = arrC.getItemAt(1).toString();3sNews.Net——3S社区&资讯平台c-Hr\7p7p q2J]}O myMap.infoWindow.title= str+"."+str2; 0xM*rN C8p0 var vbox :VBox = new VBox(); t v{kt0 var vbox2 :VBox = new VBox(); )Y$bj \SE)j.bv[6a0 var hbox :HBox = new HBox(); t3A"HdS!Kx(|0 var canvas:Canvas = new Canvas(); xL'XCs e U HHA0 var path:String = "assets\\weather\\"; %}!iH*N7x5w%N0 var img1 :Image = new Image;3sNews.Net——3S社区&资讯平台5zrwU#au/_#P[ img1.load(path+arrC.getItemAt(8).toString());3sNews.Net——3S社区&资讯平台 g Py'V T hbox.addChild(img1); .gPSm,ol.BL|s0 var img2 :Image = new Image;3sNews.Net——3S社区&资讯平台)Z&R#g[-F7hw8c img2.load(path+arrC.getItemAt(9).toString()); qD_J(H4g-i a:x0 hbox.addChild(img2);3sNews.Net——3S社区&资讯平台}u.|\z-]N 3sNews.Net——3S社区&资讯平台 ZZ2u$lXdF.X 3sNews.Net——3S社区&资讯平台R7ha%p%|k+y var txtTem :Text = new Text(); 'bmsIRM&E}I0 txtTem.text = arrC.getItemAt(5).toString();3sNews.Net——3S社区&资讯平台+g B!W,m7cfT var txtWea :Text = new Text();3sNews.Net——3S社区&资讯平台 ymx{8pq!Hk k txtWea.text = arrC.getItemAt(6).toString(); Mz7vX/|0q;u1xg0 var txtWind :Text = new Text();3sNews.Net——3S社区&资讯平台G G6Mvl S0_ txtWind.text = arrC.getItemAt(7).toString();3sNews.Net——3S社区&资讯平台8q[Flm"G:_2s vbox.addChild(txtTem);3sNews.Net——3S社区&资讯平台qGjjLHo#PPh/qH vbox.addChild(txtWea); 4A#gq3|h @M0 vbox.addChild(txtWind); 5Y4arOl4p#S0 vbox2.addChild(hbox); 7@ jnEQ0 vbox2.addChild(vbox);3sNews.Net——3S社区&资讯平台r@f e,Aw canvas.addChild(vbox2);3sNews.Net——3S社区&资讯平台r6s5x^d3} 3sNews.Net——3S社区&资讯平台z"|VE)ve;x*F myMap.infoWindow.content = canvas; 9C"uZ9b2Y_2ydrd0 var mapPnt2:MapPoint = new MapPoint (114.1547298,30.5127677); (\guP~/O(Fk0 myMap.infoWindow.show(mapPnt2);3sNews.Net——3S社区&资讯平台 sCm!`-W3K RHx)p myMap.centerAt(mapPnt2); u3ktiO0 }3sNews.Net——3S社区&资讯平台%ixF%zLQ,G3@,b~ }3sNews.Net——3S社区&资讯平台`9GhamXt ]]>3sNews.Net——3S社区&资讯平台-v4q0o7b2`&e)@;j </mx:Script> <esri:Map id="myMap" penHandCursorVisible="false">3sNews.Net——3S社区&资讯平台Fc8jg*I'V'z5^$P <esri:extent> AF'QQ2st9N,W0 <esri:Extent xmin="113" ymin="30" xmax="115" ymax="32"/> )Ymv-{8QA5@6k0 </esri:extent> :JveH[8X0 <esri:ArcGISTiledMapServiceLayer 4ubyj8r4p0Pmd0 url="http://server.arcgisonline.com/ArcGIS/rest/services/ESRI_StreetMap _World_2D/MapServer"/> Wp{o{0 </esri:Map> @0ov}q0 <mx:WebService id="weatherWS" wsdl="http://www.webxml.com.cn/WebServices/WeatherWebService.asmx?WSDL" showBusyCursor="true"/> </mx:Application> -o["U,v:gK0