Creating an extent DropDownList

5274
18
10-25-2010 03:59 PM
JasonLevine
Occasional Contributor II
Hello,
   I'm trying to create a bookmark drop down list in my flex app.  I've created the drop down bar with this code:

<s:DropDownList width="164" prompt="Select Your Community">
<s:ArrayCollection>
  <fx:String>Community #1</fx:String>
  <fx:String>Community #2</fx:String>
</s:ArrayCollection>
</s:DropDownList>

My two questions are:
1) Where do specify the extent values (minx, miny, etc...) for each community? Do I do that within the string tag, or do I create a separate xml file with the data?
2) How do I add a function that zooms the map to the extent specified when a city is selected from the drop down list?

Thanks for your help,
Jason
Tags (2)
0 Kudos
18 Replies
KenBuja
MVP Esteemed Contributor
The first line in the try block (line 38) should be

var loader:URLLoader = URLLoader(event.target)
0 Kudos
KenBuja
MVP Esteemed Contributor
Have you stepped through the code using the debugger? I would put a breakpoint at the If statement and check your variables to make sure you have properly read in the XML file. I've attached a screenshot of the XML list variable I get from my code. In this particular project, I'm not using the Extents node, but I've expanded out one of the nodes I am using (which also populates a combobox)
0 Kudos
JasonLevine
Occasional Contributor II
Hi Ken,
    I managed to compile it all without any errors, however, the values in the xml don't seem to be loading into the Combobox.  where do I call the init() function?  Is it something like this?:

<?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" 
      xmlns:container="com.esri.ags.script.*" 
      initialize="init()" >
0 Kudos
KenBuja
MVP Esteemed Contributor
I have that in the creationComplete event
0 Kudos
JasonLevine
Occasional Contributor II
I added it to the creationComplete event, and the xml values still don't load in the combobox.  See anything wrong with my code?

Thanks,
Jason

Here are the functions:
//the following two functions import the bookmarks.xml file
   private var xmlParameters:XML;    
   public var xmlProjectParameters:XMLList;
   
   private function init():void
   {
    var xmlLoader:URLLoader = new URLLoader();
    xmlLoader.load(new URLRequest("bookmarks.xml"));
    xmlLoader.addEventListener(Event.COMPLETE,init_onComplete);
   }
   
   private function init_onComplete(event:Event):void
   {
    var extentArray:ArrayCollection = new ArrayCollection;
    
    try
    {
     var loader:URLLoader = URLLoader(event.target)
     xmlParameters = new XML(loader.data)
     xmlProjectParameters = xmlParameters.communities.(@id=="communities")
     
     if (!(xmlParameters.extents == undefined))
     {
      dropdown.visible = true;
      for (var i:int = 0; i < xmlProjectParameters.extents.extent.length(); i++)
      {
       extentArray.addItem({label:xmlProjectParameters.extents.extent.@name.toString(), xmin: xmlProjectParameters.extents.extent.@xmin.toString(), ymin: xmlProjectParameters.extents.extent.@ymin.toString(), xmax: xmlProjectParameters.extents.extent.@xmax.toString(), ymax: xmlProjectParameters.extents.extent.@ymax.toString()});
      }
      dropdown.dataProvider = extentArray;
      
     }
    }
    catch(e:Error)
    {
     Alert.show("Error: " + e.message);
     return;
    }
   }
   
   //Zoom to your community tool   
   public function change():void
   {
    var extent:Extent = new Extent(Number(dropdown.selectedItem.xmin), Number(dropdown.selectedItem.ymin), Number(dropdown.selectedItem.xmax), Number(dropdown.selectedItem.ymax))
    myMap.extent = extent;
   }


Here is my bookmarks.xml file:
<bookmarks>
  <communities id="communities">
 <extents>
   <extent name="Community #1" xmin="-13181026" ymin="4010315" xmax="-13164974" ymax="4017443"/>
    </extents>
  </communities>
</bookmarks>
0 Kudos
JasonLevine
Occasional Contributor II
Problem solved.  I removed the try and catch and shortened it up a bit:
private function init_onComplete(event:Event):void
   {
    var extentArray:ArrayCollection = new ArrayCollection;
    var loader:URLLoader = URLLoader(event.target)
    xmlParameters = new XML(loader.data)
    xmlProjectParameters = xmlParameters.communities.(@id=="communities")
    for (var i:int = 0; i < xmlProjectParameters.extents.extent.length(); i++)
    {
    extentArray.addItem({label:xmlProjectParameters.extents.extent.@name.toString(), xmin: xmlProjectParameters.extents.extent.@xmin.toString(), ymin: xmlProjectParameters.extents.extent.@ymin.toString(), xmax: xmlProjectParameters.extents.extent.@xmax.toString(), ymax: xmlProjectParameters.extents.extent.@ymax.toString()}); 
    }
    dropdown.dataProvider = extentArray;
   }


Thanks for your help,
Jason
0 Kudos
MarcGuidry
New Contributor II
Hi,
Sorry to dig up an old thread but...
I've got my combo box working but I was wondering how to get the combo box selection to reset after a selection has been made?  That way you can select the first extent, pan around, and go back to that first extent without having to select a different extent first.
0 Kudos
EvelynHernandez
Occasional Contributor III

Add the features from the last choosen to an arraylist or arraycollection variable, then when u wanna go back u will pass those values to the zoom extent.

denverweston
New Contributor III

Hey Jason,

Do you have the updated code for this drop down?  My combobox will still not populate using the code above.

0 Kudos