Change the order of features in popups in 4.x JS API

799
5
11-27-2020 02:59 PM
JoeRogan
New Contributor III

The layers in my map often have many overlapping features and when the popup is opened I'd like to be able to order them by a field in order to have the most relevant features at the top of the stack.  Was able to find an older 3.x example of this, but I can't find the equivalent for 4.x.  Any suggestions?  No need to rewrite this for me, just point me to the right object/method/event if it exists, thanks!

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;  
        });  

 

5 Replies
DheerajGambhir1
New Contributor

Any luck on this ? I am facing the same issue and want resolution for this ?

0 Kudos
MichelRietveld
Esri Contributor
mapView.watch("popup.viewModel.features", (graphics) => {
          console.log("features", graphics, mapView.popup.viewModel);
        });
0 Kudos
AnthonyThompsonFWP
New Contributor

Hi Michel - 

I'm also trying to reorder features in the popup. I tried using a watch on the popup.viewModel.features object, but then when I try to reorder the features it triggers the watch again, causing an infinite loop. I also tried comparing the current and intended order of features prior to setting the value to avoid triggering the watch again, but the features value seems inconsistent. Any ideas? Thanks

0 Kudos
MichelRietveld
Esri Contributor
I set the index on the property mapView.popup.viewModel.selectedFeatureIndex

// Show first the node, if there is a node inside list of selected graphics.
mapView.watch("popup.viewModel.features", (graphics: Graphic[]) => {
if (graphics && graphics.length > 1) {
for (let i = 0; i < graphics.length; i++) {
const graphic = graphics[i];
if (graphic.layer.title === config.layerNames.nodeLayerName) {
mapView.popup.viewModel.selectedFeatureIndex = i;
break;
}
}
}
});

0 Kudos
AnthonyThompsonFWP
New Contributor

Thanks - that does at least work to set the initially selected index, which works for now.

0 Kudos