FeatureLayer MouseOver vs NavigationTool

GlenReid — Sat, 11 Dec 2021 07:52:48 GMT

I added a very simple navigation bar to the InfoWindow on MouseOver sample.

On load, the featureLayer mouseOver events work fine. When navigation is activated (by any tool), the mouseOver events fail to work. Once navigation is deactivated, the MouseOver events work again.

Test case:

<?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"
      pageTitle="FeatureLayer - show InfoWindow on mouseOver">
 <!--
 This sample shows you how to display an InfoWindow on a mouse over ("map tips").
 
 The 46 South Carolina counties are all fetched from the server using the
 'snapshot' mode and drawn clientside.  As the mouse moves over a county,
 an infoWindow will show as a 'map tip'.
 -->
 
 <fx:Script>
  <![CDATA[
   import com.esri.ags.Graphic;
   import com.esri.ags.SpatialReference;
   import com.esri.ags.events.GraphicEvent;
   import com.esri.ags.geometry.Extent;
   import spark.events.IndexChangeEvent;

   protected function fLayer_graphicAddHandler(event:GraphicEvent):void {
    event.graphic.addEventListener(MouseEvent.MOUSE_OVER, onMouseOverHandler);
    event.graphic.addEventListener(MouseEvent.MOUSE_OUT, onMouseOutHandler);
   }
   
   private function onMouseOverHandler(event:MouseEvent):void {
    var gr:Graphic = Graphic(event.target);
    gr.symbol = mouseOverSymbol;
    myTextArea.htmlText = "<b>2000 Population: </b>" + gr.attributes.POP2000.toString() + "\n"
     + "<b>2000 Population per Sq. Mi.: </b>" + gr.attributes.POP00_SQMI.toString() + "\n"
     + "<b>2007 Population: </b>" + gr.attributes.POP2007 + "\n"
     + "<b>2007 Population per Sq. Mi.: </b>" + gr.attributes.POP07_SQMI;
    myMap.infoWindow.label = gr.attributes.NAME;
    myMap.infoWindow.closeButtonVisible = false;
    myMap.infoWindow.show(myMap.toMapFromStage(event.stageX, event.stageY));
   }
   
   private function onMouseOutHandler(event:MouseEvent):void {
    var gr:Graphic = Graphic(event.target);
    gr.symbol = defaultsym;
    myMap.infoWindow.hide();
   }
   
   private function zoomToSouthCarolina():void {
    var southCarolinaExtent:Extent = new Extent(-9294000, 3667000, -8739000, 4217000, new SpatialReference(102100));
    myMap.extent = southCarolinaExtent;
    
    // make sure the whole extent is visible
    if (!myMap.extent.contains(southCarolinaExtent)) {
     myMap.level--;
    }
   }

   private function tbbChangeHandler(event:IndexChangeEvent):void {
    switch (tbb.selectedItem) {
     case "Zoom In": {
      navTool.activate(NavigationTool.ZOOM_IN);
      break;
     }
     case "Zoom Out": {
      navTool.activate(NavigationTool.ZOOM_OUT);
      break;
     }
     case "Pan": {
      navTool.activate(NavigationTool.PAN);
      break;
     }
     default: {
      navTool.deactivate();
      break;
     }
    }
   }
  ]]>
 </fx:Script>
 
 <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";
  @namespace components "com.esri.ags.components.*";
  
  components|InfoWindow {
   content-background-alpha : 0;
   background-color : yellow;
   background-alpha : 0.8;
   border-style : solid;
  }
 </fx:Style>
 
 <fx:Declarations>
  <esri:NavigationTool id="navTool" map="{myMap}"/>
  <esri:SimpleFillSymbol id="mouseOverSymbol" alpha="0.5">
   <esri:SimpleLineSymbol width="0" color="0xFF0000"/>
  </esri:SimpleFillSymbol>
  <esri:SimpleFillSymbol id="defaultsym" alpha="0.2">
   <esri:SimpleLineSymbol width="0" color="0xEEEEEE"/>
  </esri:SimpleFillSymbol>
 </fx:Declarations>
 
 <s:layout>
  <s:VerticalLayout/>
 </s:layout>
 
 <s:HGroup width="100%" paddingTop="5" paddingLeft="5" paddingRight="5">
  <s:ButtonBar id="tbb" change="tbbChangeHandler(event)"> 
   <s:ArrayList>
    <fx:String>Zoom In</fx:String>
    <fx:String>Zoom Out</fx:String>
    <fx:String>Pan</fx:String>
    <fx:String>Deactivate</fx:String>
   </s:ArrayList>
  </s:ButtonBar>
 </s:HGroup>

 <esri:Map id="myMap" load="zoomToSouthCarolina()">
  <esri:infoWindowContent>
   <mx:TextArea id="myTextArea" width="250" height="75"/>
  </esri:infoWindowContent>
  <esri:ArcGISTiledMapServiceLayer url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"/>
  <esri:FeatureLayer id="fLayer"
         definitionExpression="STATE_NAME='South Carolina'"
         graphicAdd="fLayer_graphicAddHandler(event)"
         mode="snapshot"
         outFields="*"
         symbol="{defaultsym}"
         url="http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/ESRI_Census_USA/MapServer/3"/>
 </esri:Map>
 
 <s:Label width="100%" enabled="{fLayer.loaded}"
    text="The {fLayer.numGraphics} South Carolina counties are all fetched from the server using the 'snapshot' mode and drawn clientside.  As the mouse moves over a county, an infoWindow will show as a 'map tip'."/>
 
</s:Application>

Is there a way to avoid this?

Thanks,
Glen

Re: FeatureLayer MouseOver vs NavigationTool

RobertScheitlin__GISP — Fri, 25 Mar 2011 18:22:14 GMT

Glen,

It is pretty simple just add true for EnableGraphicsLayerMouseEvent on the navTool.activate.

navTool.activate(NavigationTool.ZOOM_IN, true);

Re: FeatureLayer MouseOver vs NavigationTool

GlenReid — Fri, 25 Mar 2011 18:33:44 GMT

Simple indeed. Thanks Robert.

topic Re: FeatureLayer MouseOver vs NavigationTool in ArcGIS API for Flex Questions

FeatureLayer MouseOver vs NavigationTool

Re: FeatureLayer MouseOver vs NavigationTool

Re: FeatureLayer MouseOver vs NavigationTool