Take the 2-minute tour ×
Geographic Information Systems Stack Exchange is a question and answer site for cartographers, geographers and GIS professionals. It's 100% free, no registration required.

This applies to the ArcGIS Server JavaScript API 2.4.

The Identify Task sample shows how IdentifyTask can be used to find features in multiple layers, as specified in the IdentifyParameters:

identifyParams.layerIds = [0,2];

In this sample, the infoWindow already contains elements for the expected layers, which are used to display multiple features in separate tabs of the infoWindow:

<!-- info window tabs -->
<div id="tabs" dojoType="dijit.layout.TabContainer" style="width:385px;height:150px;">
  <div id="bldgTab" dojoType="dijit.layout.ContentPane" title="Buildings"></div>
  <div id="parcelTab" dojoType="dijit.layout.ContentPane" title="Tax Parcels"></div>
</div>

//In the JavaScript:
dijit.byId("bldgTab").setContent(layerTabContent(bldgResults,"bldgResults"));
dijit.byId("parcelTab").setContent(layerTabContent(parcelResults,"parcelResults"));

Is there a way to handle this dynamically, and create the required tabs at run-time?

For example, I wish to run IdentifyTask on all visible layers, and return the results in a separate tab of the infoWindow. How can I create the tabs dynamically?

share|improve this question
1  
Edited my answer to include an example of how to do this. –  Derek Swingley Jul 23 '11 at 0:31
    
awesome, thanks very much for that Derek. –  Stephen Lead Jul 24 '11 at 23:31
add comment

2 Answers

up vote 3 down vote accepted

Yes, this is possible. To create your tabs dynamically, look at creating dojo dijits programmatically vs. declaratively. When your visible layers change, modify your tab container to remove or add the appropriate tabs.

Edit: here's a proof of concept on JS Fiddle: http://jsfiddle.net/swingley/wKue4/ It doesn't really handle attributes but lets you select which layers to identify and builds the info window content dynamically.

share|improve this answer
    
Thanks Derek. If you have time, it would be great to include this in the API samples as I think it'd be of interest to lots of people –  Stephen Lead Jul 18 '11 at 23:00
    
Glad to help, I'll see what I can do to get something in the samples. –  Derek Swingley Jul 19 '11 at 1:26
    
taking one step back - I need to ensure this will work on all layers, regardless of where they come from. Further question at gis.stackexchange.com/questions/12407/…... –  Stephen Lead Jul 20 '11 at 9:04
add comment

I have figured out a way to do that, but unfortunately, for a Flex project. I don't know how transferable this is to JavaScript, but hopefully this will give you an idea of the logic. For each visible layer, the features returned from the IdentifyTask are put into a datagrid on a separate tab. Although I didn't include the additional code for the listeners added to each row in the datagrids, as you roll over each of the rows in the datagrid, the feature is highlighted on the map. You can see this in action here.

            protected function MainMap_mapClickHandler(event:MapMouseEvent):void
        {
            var identifyParams:IdentifyParameters = new IdentifyParameters();
            var clickGraphic:Graphic = new Graphic(event.mapPoint, clickPointSymbol);

            identifyParams.returnGeometry = true;
            identifyParams.tolerance = 5;
            identifyParams.width = MainMap.width;
            identifyParams.height = MainMap.height;
            identifyParams.geometry = event.mapPoint;
            identifyParams.mapExtent = MainMap.extent;
            identifyParams.spatialReference = MainMap.spatialReference;
            identifyParams.layerIds = dynamicLayer.visibleLayers.source;
            identifyParams.layerOption = IdentifyParameters.LAYER_OPTION_ALL;
            clickGraphicsLayer.clear();
            MainMap.infoWindow.hide();

            graphicsLayer.clear();
            cursorManager.setBusyCursor();

            identifyTask.url = dynamicLayer.url;
            identifyTask.execute(identifyParams, new AsyncResponder(resultFunction, faultFunction, clickGraphic));

            function resultFunction(results:Array, clickGraphic:Graphic):void
            {
                var myInfoRenderer:InfoRenderer = new InfoRenderer;
                var mapPoint:MapPoint = MapPoint(clickGraphic.geometry);
                var point:Point = MainMap.toScreen(mapPoint);

                if (results && results.length > 0)
                {
                    var oldLayer:Number = -1;
                    var resultsArray:Array = [];
                    var result:IdentifyResult;
                    var resultGraphic:Graphic;
                    var tab:TabNavigator = new TabNavigator();
                    var newVBox:VBox = new VBox;
                    var newVBoxDG:VBox = new VBox;
                    var newText:Text = new Text;
                    var newDG:DataGrid = new DataGrid;
                    var graphic:Graphic;

                    clickGraphicsLayer.add(clickGraphic);

                    result = results[0];
                    oldLayer = result.layerId;
                    resultsArray.push(result.feature.attributes);
                    newText = new Text;
                    newText.text = result.layerName;
                    graphic = result.feature;
                    graphic.alpha = 0.3;
                    graphicsLayer.add(graphic);
                    tab.width = 400;
                    tab.height = 230;

                    for (var i:int = 1; i < results.length; i++)
                    {
                        result = results[i];
                        graphic = new Graphic;
                        graphic = result.feature;
                        graphic.alpha = 0.3;
                        graphicsLayer.add(graphic);
                        if (result.layerId == oldLayer)
                        {
                            resultsArray.push(result.feature.attributes);
                        }
                        else
                        {
                            newDG = new DataGrid;
                            newVBox = new VBox;
                            newDG.dataProvider = resultsArray;


                            newDG.addEventListener(ListEvent.ITEM_CLICK, newDG_ItemRollOver, false, 0, true);
                            newDG.addEventListener(ListEvent.ITEM_ROLL_OUT, newDG_ItemRollOut, false, 0 ,true);
                            newDG.addEventListener(ListEvent.ITEM_ROLL_OVER, newDG_ItemRollOver, false, 0, true);

                            newVBox.addElement(newText);
                            newVBox.addElement(newDG);

                            newVBox.label = oldLayer.toString();
                            newVBox.label = oldLayer.toString();
                            tab.addElement(newVBox);
                            myInfoRenderer.addElement(tab);

                            newText = new Text;
                            newText.text = result.layerName;
                            resultsArray = [];
                            resultsArray.push(result.feature.attributes);
                        }
                        oldLayer = result.layerId;
                    }

                    newVBox = new VBox;
                    newVBoxDG = new VBox;
                    newDG = new DataGrid;
                    newDG.addEventListener(ListEvent.ITEM_CLICK, newDG_ItemRollOver, false, 0, true);
                    newDG.addEventListener(ListEvent.ITEM_ROLL_OUT, newDG_ItemRollOut, false, 0, true);
                    newDG.addEventListener(ListEvent.ITEM_ROLL_OVER, newDG_ItemRollOver, false, 0, true);
                    newVBox.addElement(newText);
                    newDG.dataProvider = resultsArray;

                    newVBox.addElement(newDG);
                    newVBox.label = oldLayer.toString();
                    tab.addElement(newVBox);
                    myInfoRenderer.addElement(tab);

                    cursorManager.removeBusyCursor();

                    MainMap.infoWindow.content = myInfoRenderer;
                    MainMap.infoWindow.label = "Results";
                    MainMap.infoWindow.show(MainMap.toMap(point));
                    MainMap.infoWindow.addEventListener(Event.CLOSE, infoWindow_Close, false, 0, true);
                }
            }
        }
share|improve this answer
    
Thanks Ken, this looks promising –  Stephen Lead Jul 18 '11 at 23:00
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.