[ArcGIS API Flex] Multiple map components added to application

Marlon_JoséLópez_Meza — Sun, 12 Dec 2021 16:40:15 GMT

Greetings,

Im working in a web application with the requirement of displaying multiple map instances on it, each one with its own graphics addes to its respective layers...

The problem is related to the graphic addition in a map's graphic layer, it happen that a graphic that is added to map1 is hidden when I add a graphic in map2.

Here is a test application with two spark panels, each one with a Map instance, a ArcGISTiledMapServiceLayer and a GraphicsLayer. The button, when its pressed, perform a Graphic addition to map1's graphicslayer, and using a timer, edit the graphic and adds to map2's graphicslayer.

The result (Fail): the map1 shows graphic1, but when map2 shows the graphic added, map1 graphic is hidden/removed from view.

I like to know how resolve this issue, and be secure that is not a bug

A sample:


<?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"
      minWidth="955" minHeight="600" pageTitle="prueba mÃºltiples mapas"
      viewSourceURL="srcview/index.html">
 
 <fx:Script>
  <![CDATA[
   import com.esri.ags.Graphic;
   import com.esri.ags.SpatialReference;
   import com.esri.ags.events.GraphicEvent;
   import com.esri.ags.events.MapEvent;
   import com.esri.ags.geometry.MapPoint;
   import com.esri.ags.geometry.Polygon;
   import com.esri.ags.symbols.SimpleFillSymbol;
   
   import mx.collections.ArrayCollection;
   import mx.controls.Alert;
   protected function addGeomBtn_clickHandler(event:MouseEvent):void
   {
    var myPolygon:Polygon = new Polygon(
     [[
      new MapPoint(2352491, -1992338),
      new MapPoint(2332923, -2461967),
      new MapPoint(2646009, -2266288),
      new MapPoint(3076503, -2324992),
      new MapPoint(3272181, -2520670),
      new MapPoint(3506996, -2559806),
      new MapPoint(3702675, -3049003),
      new MapPoint(3370021, -3675175),
      new MapPoint(2763416, -4046965),
      new MapPoint(2117676, -4144804),
      new MapPoint(1961133, -3890422),
      new MapPoint(2000269, -3655607),
      new MapPoint(1667615, -3185978),
      new MapPoint(1550208, -2422831),
      new MapPoint(1334961, -1953202),
      new MapPoint(2352491, -1992338)
     ]], new SpatialReference(102100));
    var myGraphicPolygon:Graphic = new Graphic();
    myGraphicPolygon.geometry = myPolygon;
    myGraphicPolygon.symbol = new SimpleFillSymbol(
     SimpleFillSymbol.STYLE_SOLID, // fill style
     0xFF0000, // fill color
     0.7 // fill alpha
    );
    myGraphicPolygon.toolTip = "Polygon added with ActionScript (Map 1)";
    geom01.add(myGraphicPolygon);

    var timer:Timer=new Timer(300,1);
    timer.addEventListener(TimerEvent.TIMER_COMPLETE,function completado():void{
     myGraphicPolygon.symbol = new SimpleFillSymbol(
      SimpleFillSymbol.STYLE_SOLID, // fill style
      0x00CC00, // fill color
      0.7 // fill alpha
     );
     myGraphicPolygon.id="mgp2";
     myGraphicPolygon.toolTip = "Polygon added with ActionScript (Map 2)";
     geom2.add(myGraphicPolygon);
    });
    timer.start();
    
    (event.target as Button).enabled=false;
   }
   
   protected function logEvent(event:Event):void
   {
    logTexts.text=event.type+" - " + event.target.id +"\n"+logTexts.text;
   }
   
  ]]>
 </fx:Script>
 
 <s:Panel id="panel01" y="32" width="282" height="226" dropShadowVisible="false"
    horizontalCenter="-100" title="Panel 1">
  <esri:Map mapNavigationEnabled="false" left="5" right="5" top="5" bottom="5" toolTip="mapa 1" id="panelmap01" scaleBarVisible="false">
   <esri:ArcGISTiledMapServiceLayer id="mp01l" url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"/>
   <esri:GraphicsLayer id="geom01" updateEnd="logEvent(event)" graphicsClear="logEvent(event)" graphicAdd="logEvent(event)" graphicRemove="logEvent(event)"/>
  </esri:Map>
 </s:Panel>
 <s:Panel id="panel02" y="33" width="282" height="226" dropShadowVisible="false"
    horizontalCenter="200" title="Panel 2">
  <esri:Map mapNavigationEnabled="false" left="5" right="5" top="5" bottom="5" toolTip="mapa 2" id="panelmap02" scaleBarVisible="false">
   <esri:ArcGISTiledMapServiceLayer id="mp11l" url="http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer"/>
   <esri:GraphicsLayer id="geom2" updateEnd="logEvent(event)" graphicAdd="logEvent(event)" graphicRemove="logEvent(event)"/>
  </esri:Map>
 </s:Panel>
 <s:Button id="addGeomBtn" y="271" label="Agregar grÃ¡fico" click="addGeomBtn_clickHandler(event)"
     horizontalCenter="0"/>
 <s:RichText id="logTexts" left="20" right="20" text="" verticalCenter="20"/>
</s:Application>

reqs: libs/agslib-2.3.1-2011-04-26.swc

Re: [ArcGIS API Flex] Multiple map components added to application

RobertScheitlin__GISP — Sun, 17 Jul 2011 23:50:20 GMT

Marlon José,

A Graphic can only exist in one UIComponent at a time that is why you are having an issue. Just create a new graphic object and use the other graphic objects geometry and attributes (if that is what you are after).

Re: [ArcGIS API Flex] Multiple map components added to application

Marlon_JoséLópez_Meza — Mon, 18 Jul 2011 14:58:11 GMT

Marlon JosÃ©,

A Graphic can only exist in one UIComponent at a time that is why you are having an issue. Just create a new graphic object and use the other graphic objects geometry and attributes (if that is what you are after).

😮 ... that solved it. i created a new graphic object and dynamically edit its properties (geometry, symbol, tooltip and attributes)

thanks... in a moment i'll publish a sample with the solution of the issue from my perspective.

topic Re: [ArcGIS API Flex] Multiple map components added to application in ArcGIS API for Flex Questions

[ArcGIS API Flex] Multiple map components added to application

Re: [ArcGIS API Flex] Multiple map components added to application

Re: [ArcGIS API Flex] Multiple map components added to application