ARCGIS viewer入门(10）自定义infowindow

方法一：完全自定义infowindows方法：

1. private function myResultFunction(results:Array, clickGraphic:Graphic = null):void
2. {
3. trace("results:"+results);
4. if (results && results.length > 0)
5. {
6. var result:IdentifyResult = results[0];
7. var resultGraphic:Graphic = result.feature;
9. resultGraphic.symbol = smsIdentify;
10. //resultGraphic.infoWindowRenderer=myInfoWindowRenderer;
11. graphicsLayer.clear();
13. graphicsLayer.add(resultGraphic);
15. lastIdentifyResultGraphic = resultGraphic;
17. var mapPoint:MapPoint = resultGraphic.geometry as MapPoint;
18. var myInfoPopup:MyInfoPopup = new MyInfoPopup;
19. myInfoPopup.MRID = resultGraphic.attributes.MRID;
20. myInfoPopup.NAME = resultGraphic.attributes.NAME;
21. myInfoPopup.ALIASNAME = resultGraphic.attributes.ALIASNAME;
22. myInfoPopup.LONGITUDE = resultGraphic.attributes.LONGITUDE;
23. myInfoPopup.LATITUDE = resultGraphic.attributes.LATITUDE;
25. myMap.infoWindow.label = resultGraphic.attributes.ALIASNAME;
26. myMap.infoWindow.content = myInfoPopup;//这个是关键，这个content可以赋值任何一个控件或者容器。
27. myMap.infoWindow.show( mapPoint );
29. trace("clickGraphic:"+clickGraphic);
30. //clickGraphic.symbol = new InfoSymbol(); // use default renderer
31. // clickGraphic.symbol=smsIdentify;
32. // clickGraphic.infoWindowRenderer = myInfoWindowRenderer;
33. // clickGraphic.attributes = resultGraphic.attributes;
35. }
36. }

[js]  view plain copy

1. private function myResultFunction(results:Array, clickGraphic:Graphic = null):void  
2. {  
3.     trace("results:"+results);  
4.     if (results && results.length > 0)  
5.     {  
6.         var result:IdentifyResult = results[0];  
7.         var resultGraphic:Graphic = result.feature;  
8.           
9.         resultGraphic.symbol = smsIdentify;  
10.         //resultGraphic.infoWindowRenderer=myInfoWindowRenderer;  
11.         graphicsLayer.clear();  
12.           
13.         graphicsLayer.add(resultGraphic);  
14.           
15.         lastIdentifyResultGraphic = resultGraphic;  
16.           
17.         var mapPoint:MapPoint = resultGraphic.geometry as MapPoint;  
18.         var myInfoPopup:MyInfoPopup = new MyInfoPopup;  
19.         myInfoPopup.MRID = resultGraphic.attributes.MRID;  
20.         myInfoPopup.NAME = resultGraphic.attributes.NAME;  
21.         myInfoPopup.ALIASNAME = resultGraphic.attributes.ALIASNAME;  
22.         myInfoPopup.LONGITUDE = resultGraphic.attributes.LONGITUDE;  
23.         myInfoPopup.LATITUDE = resultGraphic.attributes.LATITUDE;  
24.           
25.         myMap.infoWindow.label = resultGraphic.attributes.ALIASNAME;  
26.         myMap.infoWindow.content = myInfoPopup;   
27.         myMap.infoWindow.show( mapPoint );  
28.           
29.         trace("clickGraphic:"+clickGraphic);  
30.         //clickGraphic.symbol = new InfoSymbol(); // use default renderer  
31.     //  clickGraphic.symbol=smsIdentify;  
32.     //  clickGraphic.infoWindowRenderer = myInfoWindowRenderer;  
33.        // clickGraphic.attributes = resultGraphic.attributes;  
34.           
35.     }  
36. }  

MyInfoPopup.mxml 

Js代码   

1. <?xml version="1.0" encoding="utf-8"?>
2. <mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml">
3. <mx:Script>
4. <![CDATA[
5. [Bindable]
6. public var MRID:String;
8. [Bindable]
9. public var NAME:String;
11. [Bindable]
12. public var ALIASNAME:String;
14. [Bindable]
15. public var LONGITUDE:String;
17. [Bindable]
18. public var LATITUDE:String;
19. ]]>
20. </mx:Script>
21. <mx:VBox backgroundColor="0xEEEEEE" >
22. <mx:Label text="MRID : {MRID}"/>
23. <mx:Label text="编码: {NAME}"/>
24. <mx:Label text="名称: {ALIASNAME}"/>
25. <mx:Label text="经度: {LONGITUDE}"/>
26. <mx:Label text="纬度: {LATITUDE}"/>
27. </mx:VBox>
28. </mx:Canvas>  

方法二：完全自定义infowindows方法：

InfoWindow.mxml

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

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

xmlns:esri="http://www.esri.com/2008/ags"

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

xmlns:samples="InfoWindowRenderer.*" >

<fx:Style>

@namespace esri "http://www.esri.com/2008/ags";

@namespace s "library://ns.adobe.com/flex/spark";

@namespace samples "InfoWindowRenderer.*";

.styles

{

fills:#81C3FB blue green;

border-color:green;

border-thickness: 1;

background-color: #81C3FB;

font-size: 14;

upper-left-radius: 15;

lower-right-radius:15;

info-placement: top;

}

</fx:Style>

<fx:Script>

<![CDATA[

import com.esri.ags.Graphic;

import com.esri.ags.events.GraphicEvent;

import com.esri.ags.geometry.MapPoint;

import com.esri.ags.geometry.Polyline;

private function graphicAddHandler(event:GraphicEvent):void

{

event.graphic.toolTip = "工程编号："+event.graphic.attributes.Id+"\n"

+ "工程名："+event.graphic.attributes.NAME ;

event.graphic.addEventListener(MouseEvent.CLICK, onMouseCLickHandler);

}

private function onMouseCLickHandler(event:MouseEvent):void

{

const graphic:Graphic = event.target as Graphic;

if (graphic)

{

const mapPoint:MapPoint = (Polyline(graphic.geometry)).paths[0][0] as MapPoint;

var infoContent:InfowindowContent = new InfowindowContent();

infoContent.data = graphic.attributes;

map.infoWindowContent = infoContent;

map.infoWindow.styleName = "styles";

const point:Point = map.toScreen(mapPoint);

map.infoWindow.label = graphic.attributes.NAME;

map.infoWindow.show(map.toMap(point));

}

}

]]>

</fx:Script>

<fx:Declarations>

<esri:SimpleLineSymbol id="sls" width="3" color="0x00FF00"/>

</fx:Declarations>

<esri:Map id="map" openHandCursorVisible="false">

<esri:ArcGISDynamicMapServiceLayer url="http://localhost:8399/arcgis/rest/services/GEOSWNMap/MapServer"/>

<esri:FeatureLayer id="citiesFeatureLayer"

graphicAdd="graphicAddHandler(event)"

mode="snapshot"

symbol="{sls}"

outFields="*"

url="http://localhost:8399/arcgis/rest/services/GEOSWNMap/MapServer/1">

</esri:FeatureLayer>

</esri:Map>

</s:Application>

InfowindowContent.mxml

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

<mx:Canvas styleName="canvans" xmlns:fx="http://ns.adobe.com/mxml/2009"

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

xmlns:mx="library://ns.adobe.com/flex/mx"

minHeight="100" minWidth="300">

<fx:Style>

@namespace s "library://ns.adobe.com/flex/spark";

@namespace mx "library://ns.adobe.com/flex/mx";

.canvans{

background-color:white;

horizontal-align:center;

}

.linkButton{

font-size: 14;

font-weight: bold;

color:green;

roll-over-color:green;

background-color:green;

}

</fx:Style>

<s:VGroup width="100%" height="100%" paddingTop="20" horizontalAlign="center">

<s:Label text="{data.NAME}" height="25"/>

<s:HGroup horizontalAlign="center" width="100%">

<mx:LinkButton label="查看单元数据" styleName="linkButton" />

<mx:LinkButton label="查看单元对比数据" styleName="linkButton" />

</s:HGroup>

</s:VGroup>

</mx:Canvas>

原地址：http://blog.csdn.net/yangtang_newton/article/details/8283880