5

I am using version 3.12 of the ESRI ArcGIS Javascript API and have noticed that the order of the features that show up in my info window popup does not correspond to the order layers those features are in. I want to be able to specify that all of the features from the same layer appear next to each other as I toggle though the selected features.

For example, say I have a map with two feature layers in the following order: 1. tax_parcels and 2. county_border. If I click on a spot within county_border where tax_parcels has overlapping features, I would expect my info window popup to show info for parcel1. When I click the next arrow I expect to see info for parcel2 and info for the county when I click next again. In my actual map in some cases I am seeing parcel1 followed by county followed by parcel2.

I found this thread: https://geonet.esri.com/thread/169793 but it did not provide any solutions. Does anyone know of a way to do this?

4
  • Did you try listening to the Popup's on-set-features event, and re-ordering the features? developers.arcgis.com/javascript/3/jsapi/… Jun 3, 2016 at 18:49
  • Actually, yes, I was able to get it working using that approach. I came back to answer my question but you beat me to it. Do you want to post it as an answer?
    – Chris
    Jun 3, 2016 at 19:39
  • but how to define ImportantLayer?
    – ziemek
    Jan 11, 2018 at 9:39
  • @ziemek In the example below, ImportantLayer is a placeholder for the id of the layer that should be on top. This id can be defined multiple ways depending on how you are creating your map/adding your layers. I suggest you ask a separate question about how to retrieve that if you need help finding it. That will allow you to provide details about how your map and layers are created.
    – Chris
    Jan 11, 2018 at 15:59

1 Answer 1

5

Re-order the features when the Popup's on-set-features event fires.

Here is a code snippet of how to do this:

function bindInfoWindowSortingFunction(map) {  
    require(['dojo/_base/connect'], function (connect) {  
        connect.connect(map.infoWindow, "onSetFeatures", function () {  
            var orderedFeatures = [];  
            for(var i = 0; i< map.infoWindow.features.length; i++) {  
                if (map.infoWindow.features[i]._layer.id === 'ImportantLayer') {  
                    orderedFeatures.unshift(map.infoWindow.features[i]);  
                }  
                else {  
                    orderedFeatures.push(map.infoWindow.features[i]);  
                }  
            }  
            map.infoWindow.features = orderedFeatures;  
        });  
    });  
}  

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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