Select to view content in your preferred language

Infowindow for graphics layer

1490
17
04-26-2011 12:23 PM
codyhughes
Deactivated User
ok so the backstory is this...
i have a widget that upon selection of certain options it creates a graphics layer based on lat longs that were stored in an arraycollection. my issue is that upon clicking on that graphic on the map(lets call it gr) inside that graphics layer (call it gl) i want to display all attributes that the gr contains ideally like the identify widget so as not to have to format the "info pop up" too much or at all if i dont have to. I can not for the life of me figure out how to populate the popup .
on creation of each of the gr's i add event listener for a click on it which works.
so i guess my problem is which do i use....popup, infowindow, identitytask
and how would i implement it. could any one please help me out and at least steer me in the direction of a sample that does this. cus i have looked at alot of esri samples and they are all in mxml  and i need it in actionscript. oh and im using flexviewer 2.3

my gl creation loop
if(FullArfInfoArr.length > 0){
for (var i:int = 0;i<RecCnt-1;i++){
      if(!isNaN(FullArfInfoArr.getItemAt(i).fltSiteLON) && !isNaN(FullArfInfoArr.getItemAt(i).fltSiteLAT)){
            var point:MapPoint = new MapPoint(FullArfInfoArr.getItemAt(i).fltSiteLON,FullArfInfoArr.getItemAt(i).fltSiteLAT);
             var ptGraphic:Graphic = new Graphic(point);
  ptGraphic.geometry = WebMercatorUtil.geographicToWebMercator(point);
  ptGraphic.symbol = symMain;
      
ptGraphic.addEventListener(MouseEvent.CLICK,mapClickHandler);
        
graphicsLayer.add(ptGraphic);};
Tags (2)
0 Kudos
17 Replies
codyhughes
Deactivated User
is there a reason why the infowindowrenderer code i have below does not show any attributes of the graphic?
if(FullArfInfoArr.length > 0){
       for (var i:int = 0;i<RecCnt-1;i++){
        if(!isNaN(FullArfInfoArr.getItemAt(i).fltSiteLON) && !isNaN(FullArfInfoArr.getItemAt(i).fltSiteLAT)){
         var point:MapPoint = new MapPoint(FullArfInfoArr.getItemAt(i).fltSiteLON,FullArfInfoArr.getItemAt(i).fltSiteLAT);
         var ptGraphic:Graphic = new Graphic(point);
         ptGraphic.geometry = WebMercatorUtil.geographicToWebMercator(point);
         ptGraphic.symbol = symMain;
         ptGraphic.addEventListener(MouseEvent.CLICK,mapClickHandler);
         graphicsLayer.add(ptGraphic);
        }
        var infoWindowRenderer:ClassFactory = new ClassFactory(PopUpRenderer);
        infoWindowRenderer.properties = {popUpInfo: new PopUpInfo};
        graphicsLayer.infoWindowRenderer = infoWindowRenderer;
       };
0 Kudos
RobertScheitlin__GISP
MVP Emeritus
Cody,

     Where are you setting your graphics attributes?

ptGraphic.attributes = {field1: "hello", field2: "goodbye"};
0 Kudos
codyhughes
Deactivated User
Cody,

     Where are you setting your graphics attributes?

ptGraphic.attributes = {field1: "hello", field2: "goodbye"};


i had tried this before adding the graphic:
ptGraphic.attributes = FullArfInfoArr.getItemAt(i);

but it still does not pull anything.
0 Kudos
codyhughes
Deactivated User
so as of right now all i get is a blank info pop up with the zoom and close button, but no info
0 Kudos
RobertScheitlin__GISP
MVP Emeritus
Cody,

   Look at the SearchWidget.mxml and the createSearchResults function and the configurePopUpInfo functions for code examples.
0 Kudos
codyhughes
Deactivated User
Cody,

   Look at the SearchWidget.mxml and the createSearchResults function and the configurePopUpInfo functions for code examples.


ok so maybe im just being a noob, but i have an arraycollection with the data in it. do i need to reformat that data like in the create results? also im not using a query at all. i cant just pass an array/arraycollection to the attributes?
0 Kudos
RobertScheitlin__GISP
MVP Emeritus
Cody,

   If you look at the PopUpInfo documentation you have basically 2 choices use the description or popUpFieldInfos. The SearchWidget.mxml uses the createSearchResults to concatenate all the attributes and field names into a content string with line breaks. you could also use something like this example that builds popUpFieldInfos:

<?xml version="1.0" encoding="utf-8"?>
<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"
      xmlns:esri="http://www.esri.com/2008/ags">
      
 <fx:Style>
  @namespace s "library://ns.adobe.com/flex/spark";
  @namespace mx "library://ns.adobe.com/flex/mx";
  @namespace esri "http://www.esri.com/2008/ags";
  esri|PopUpRenderer
  {
   skinClass:ClassReference('myPopUp.myPopUpRendererSkin')
  }
 </fx:Style>
 <fx:Script>
  <![CDATA[
   import com.esri.ags.geometry.Extent;
   import com.esri.ags.geometry.MapPoint;
   import com.esri.ags.webmap.PopUpRenderer;
   import com.esri.ags.webmap.supportClasses.PopUpFieldFormat;
   import com.esri.ags.webmap.supportClasses.PopUpFieldInfo;
   import com.esri.ags.webmap.supportClasses.PopUpInfo;
   import com.esri.ags.webmap.supportClasses.PopUpMediaInfo;
   
   import myPopUp.myPopUpRendererSkin;

   private function initCLayer():void
   {
    var popUpInfo:PopUpInfo = new PopUpInfo();
    var pFieldInfos:Array = new Array();
    
    var pFieldInfo:PopUpFieldInfo;
    pFieldInfo = new PopUpFieldInfo();
    pFieldInfo.fieldName = "DESCRIPTION";
    pFieldInfo.format = new PopUpFieldFormat();
    pFieldInfos.push(pFieldInfo);
    
    pFieldInfo = new PopUpFieldInfo();
    pFieldInfo.fieldName = "ONLINE";
    pFieldInfo.format = new PopUpFieldFormat();
    pFieldInfos.push(pFieldInfo);
    
    pFieldInfo = new PopUpFieldInfo();
    pFieldInfo.fieldName = "LAST_UPDATED";
    pFieldInfo.format = new PopUpFieldFormat();
    pFieldInfos.push(pFieldInfo);
    
    pFieldInfo = new PopUpFieldInfo();
    pFieldInfo.fieldName = "URL";
    pFieldInfo.format = new PopUpFieldFormat();
    pFieldInfos.push(pFieldInfo);
    
    popUpInfo.popUpFieldInfos = pFieldInfos;
    
    var pMediaInfos:Array = new Array();
    var pMediaInfo:PopUpMediaInfo = new PopUpMediaInfo();
    pMediaInfo.caption = "Latest Image {LAST_UPDATED} online: {ONLINE}";
    pMediaInfo.type = "image";
    pMediaInfo.imageLinkURL = "{URL}";
    pMediaInfo.imageSourceURL = "{URL}";
    pMediaInfos.push(pMediaInfo);
    popUpInfo.popUpMediaInfos = pMediaInfos;
    popUpInfo.title = "{DESCRIPTION}"
    var popUpRenderer:ClassFactory = new ClassFactory(PopUpRenderer);
    popUpRenderer.properties = {popUpInfo:popUpInfo};
    cLayer.infoWindowRenderer = popUpRenderer;
   }
  ]]>
 </fx:Script>
 <esri:Map id="myMap" level="4" load="myMap.centerAt(new MapPoint(-11713000, 4822000))">
  <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"/>
  <esri:FeatureLayer id="cLayer" outFields="[URL,DESCRIPTION,LAST_UPDATED,ONLINE]" load="initCLayer()"
   url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Louisville/LOJIC_PublicSafety_Louisville/MapServer/2"/>
 </esri:Map>
</s:Application>
0 Kudos
codyhughes
Deactivated User
ok so im almost there. and thank you so much for your help!! what i have so far is close, but i need to get the field name out of an array collection. Im trying to use the trace method but that gives me an error when i try and pass that traced value to a string var. am i missing something?

public function configurePopUpInfo(i:int):PopUpInfo{
    var popUpInfo:PopUpInfo = new PopUpInfo;
   
    popUpInfo.title = "{strSiteName}";
   
    var value:String = "";
    var fName:String = "";
    var content:String ="";
   
    for each (var item:Object in FullArfInfoArr.getItemAt(i)){
     for (var field:String in item){
      fName = trace(field);
      value = trace(item[field]);
      //content += trace(field) + ":" + trace(item[field]) + "\n";
     }
     popUpInfo.description += fName + ":" + value + "\n";
    }
    //popUpInfo.description = content;
    return popUpInfo;
   }
0 Kudos
RobertScheitlin__GISP
MVP Emeritus
Cody,

   The trace command is only for debugging and tells Flash Bulder to output the value to the outputs window.

Try this:

   private function configurePopUpInfo(i:int):PopUpInfo{
    var popUpInfo:PopUpInfo = new PopUpInfo;
    
    popUpInfo.title = "{strSiteName}";
    
    for each (var item:Object in FullArfInfoArr.getItemAt(i)){
     for (var field:String in item){
      popUpInfo.description += field + ": " + item[field] + "\n";
     }
    }
    return popUpInfo;
   }
0 Kudos