nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Infowindow for graphics layer

codyhughes

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);};

Vind meer berichten getagd met

Accepted answers

All comments

codyhughes

ok i got it finally!!! And thank you very much for all your great help!!!! here is the popupconfig solution for passing an ac to a graphic.attributes

popupconfig function:

public function configurePopUpInfo():PopUpInfo{
 var popUpInfo:PopUpInfo = new PopUpInfo;

 popUpInfo.title = "Site Name: " + "{strSiteName}";
 var content:String = "";
 //now build giant string to pass as attributes for point
 content = "Event: {event_name} \n"
 content += "ArfID: " + " {EVENT_ID}" + " \n";
 content += "Site Status: {strSiteStatus} \n";
 content += "Site Address: {strSiteAddress} \n";
 content += "Site City: {strSiteCity} \n";
 content += "Site State: {strSiteState} \n";
 content += "Site Zip: {strSiteZip} \n";
 content += "Site County FIPS: {strSiteCountyFIPS} \n";
 popUpInfo.description = content;
 return popUpInfo;
 }

this works because i am passing an arraycollection to the graphic.attributes. also if you just want to loop through the entire a.c. you can use the below code instead of the manual build of the content string:

for each(var item:Object in FullArfInfoArr){
 for (var fld:String in item){
content += " " + fld + ": {" + fld + "}\n "
}
}

its basically the same as the first code just it loops through all the fields.

also here is the setup for the info window that is inside the loop of creating the graphicslayer:
var infoWindowRenderer:ClassFactory = new ClassFactory(PopUpRenderer);
infoWindowRenderer.properties = {popUpInfo: configurePopUpInfo()};
graphicsLayer.infoWindowRenderer = infoWindowRenderer;
hope this helps explain my solution. Again thanks for all the help rscheitlin!

codyhughes

Cory,

Maybe try :

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

thats alot closer... but it gives me all the results of the ac. i only need the ones at the specific index... btw... you are awesome i really appreciate all the help

RobertScheitlin__GISP

Cory,

Maybe try :

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

codyhughes

Cody,

Have you done a trace of the FullArfInfoArr
trace(StringUtil.toString(FullArfInfoArr));
to see what the structure of the data looks like?

is this what you mean?

FullArfInfoArr.getItemAt(i) = mx.utils.ObjectProxy (@c8eb601)
dispatcher = flash.events.EventDispatcher (@c857ba1)
dtRequestReceived = <Fri Mar 25 17:44:00 GMT-0700 2011> (@c407481)
dtTimestamp = <Mon Apr 4 22:28:25 GMT-0700 2011> (@d4b4561)
EVENT_FK = 22 [0x16]
EVENT_ID = 2
fltSiteLAT = 47.asd
fltSiteLON = -122.sadf235467
ID = 677 [0x2a5]
_id = null
_item = Object (@a778911)
dtRequestReceived = <Fri Mar 25 17:44:00 GMT-0700 2011> (@c407481)
dtTimestamp = <Mon Apr 4 22:28:25 GMT-0700 2011> (@d4b4561)
EVENT_FK = 22 [0x16]
EVENT_ID = 2
fltSiteLAT = 47.791228
fltSiteLON = -122.235467
ID = 677 [0x2a5]
Source_FK = 0
Status = "ASSIGNED"
strAssistanceDescription = "sadfasdfasdf"
strPSMA_PCN = "7"
strRequestorEmail = "asdf"
strRequestorName = "asdf"
strRequestorOrganization = "asdf"
strRequestorPhone = "asdf"
strSiteAddress = "adsfasdfst sw"
strSiteCity = "bothell"
strSiteCountyFIPS = "asdf"
strSiteName = "sadf"
strSiteState = "wa"
strSiteStatus = "Denied"
strSiteZip = "asdf"
strSOW = "asdf"
strState = "WA"
strStateFedRequest = "asdf"
strStatusComments = "test"
strUsername = "asd\\asdf"
notifiers = Object (@a778779)
object = Object (@a778911)
propertyList = [] (@c8e9f11)
proxyClass = Object (@8a4cd21)
_proxyLevel = -1 [0xffffffff]
Source_FK = 0
Status = "ASSIGNED"
strAssistanceDescription = "asdfadsfasdfadsfadsf."
strPSMA_PCN = "7"
strRequestorEmail = "asdfadsfasdf.asdf"
strRequestorName = "asdfasdf"
strRequestorOrganization = "asdfasdf"
strRequestorPhone = "asdfsadf"
strSiteAddress = "asdfasdf"
strSiteCity = "asdfl"
strSiteCountyFIPS = "asdfasdf"
strSiteName = "asdfasdf"
strSiteState = "wa"
strSiteStatus = "Denied"
strSiteZip = "asdf"
strSOW = "asdfasdfasdfasdfasdfadsf to perform the ...."
strState = "WA"
strStateFedRequest = "Federal"
strStatusComments = "test"
strUsername = "adsfasdf\\asdf"
type = null
_type = null
uid = "asdf-asdf-91D9-asdf-asdf"

RobertScheitlin__GISP

Cody,

Have you done a trace of the FullArfInfoArr

trace(StringUtil.toString(FullArfInfoArr));

to see what the structure of the data looks like?

codyhughes

Cody,

Can you post the function that makes the FullArfInfoArr?

the creation is :
[Bindable]public var FullArfInfoArr:ArrayCollection = new ArrayCollection;

the population of data is from a webservice results :

public function gotFullArfInfo(e:ResultEvent):void{
    if(e.result.Tables.Table.Rows.length > 0){
     var table:* = e.result.Tables.Table.Rows;
     FullArfInfoArr = table;
     buildGLayer(1);
    }
   }

should i convert the ac into a feature set? then try that? i might have more options

RobertScheitlin__GISP

Cody,

Can you post the function that makes the FullArfInfoArr?

codyhughes

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;
   }

so the problem is that it does not make it to the for loop. the item is actually returning the field's value so it skips the for loop .

RobertScheitlin__GISP

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;
   }

codyhughes

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;
   }

RobertScheitlin__GISP

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>

codyhughes

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?

RobertScheitlin__GISP

Cody,

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

codyhughes

so as of right now all i get is a blank info pop up with the zoom and close button, but no info

codyhughes

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.

RobertScheitlin__GISP

Cody,

Where are you setting your graphics attributes?

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

codyhughes

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;
 };

Doe mee aan het gesprek

Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.

Snelle Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.