topic Re: Displaying all attributes on click for features in Map Image Layers (JS 4.24) in ArcGIS JavaScript Maps SDK Questions

Displaying all attributes on click for features in Map Image Layers (JS 4.24)

moremeowbell — Thu, 20 Oct 2022 23:55:43 GMT

I am using the ESRI JS 4.24 API to create a mapping application that pulls in a Map Image Layer that is hosted on ArcE Portal. I am having trouble getting attributes to show in my pop-up. I would like to display all attributes in the pop-up, not just a select few.

According to documentation the

outFields: ["*"]

has been replaced with

defaultPopupTemplateEnabled: true

However, I am getting no content in my pop-up at the moment. Here's what I'm looking at currently:

Here is my code currently, any suggestions are welcome!

require([ "esri/config", "esri/WebMap", "esri/views/MapView", "esri/widgets/AreaMeasurement2D", "esri/widgets/Compass", "esri/widgets/Home", "esri/widgets/LayerList", "esri/widgets/ScaleBar", "esri/widgets/Search", "esri/widgets/BasemapToggle", "esri/widgets/Legend", "esri/widgets/Expand", "esri/core/reactiveUtils", "esri/widgets/Popup", "esri/Map", "esri/layers/MapImageLayer", "esri/PopupTemplate", ], function (esriConfig, WebMap, MapView, AreaMeasurement2D, Compass, Home, LayerList, ScaleBar, Search, BasemapToggle, Legend, Expand, reactiveUtils, Popup, Map, MapImageLayer, PopupTemplate) { esriConfig.portalUrl = "PORTAL_URL"; const map = new Map({ basemap: "gray-vector" }); const view = new MapView({ map: map, container: "viewDiv", center: [-95, 40], zoom: 4, }); let layer = new MapImageLayer({ portalItem: { id: "1acc2c72f17f44b0bd47ca31f63c9a95", }, }); map.add(layer); layer.when(() => { layer.allSublayers.forEach((sublayer) => { sublayer.popupEnabled = true; sublayer.popupTemplate = { defaultPopupTemplateEnabled: true, outFields: ["*"], } }); });

Re: Displaying all attributes on click for features in Map Image Layers (JS 4.24)

Noah-Sager — Fri, 21 Oct 2022 10:43:27 GMT

Hi @moremeowbell, unfortunately, MapImageLayer does not support defaultPopupTemplateEnabled.

https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Popup.html#defaultPopupTemplateEnabled

We have this on our roadmap for a future release, but currently, the workaround would be to create a FeatureLayer from each Sublayer to use defaultPopupTemplateEnabled.

https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-support-Sublayer.html#createFeatureLayer

I suppose the other option would be to loop through all the fields for each Sublayer once you're using the flattened collection with allSublayers and add those to the popup.

Re: Displaying all attributes on click for features in Map Image Layers (JS 4.24)

JayakumarPD — Mon, 24 Oct 2022 07:17:13 GMT

I had the same challenge but with one map service layer, I applied like this

in the feature layer constructed from client side features, I have added the bellow code

outFields: ["*"], // these are the fields, which i got from client side features fields:[{name:"KGISDistrictCode", alias:"KGISDistrictCode", type:"string"}, {name:"KGISDistrictName", alias:"KGISDistrictName", type:"string"}, {name:"MalePopulation", alias:"MalePopulation", type:"integer"}, {name:"FemalePopulation", alias:"FemalePopulation", type:"integer"}, {name:"TotalPopulation", alias:"TotalPopulation", type:"integer"} ], // I have assigned the above to objectIdField objectIdField: "fields", renderer: districtRenderer5, popupTemplate: popupDistrict1, // in popup template, called this like this const popupDistrict1 = { title: "The Stats", content: `DisstrictCode: {KGISDistrictCode} DistrictName: {KGISDistrictName} ` };

Will it be helpful

Re: Displaying all attributes on click for features in Map Image Layers (JS 4.24)

moremeowbell — Thu, 03 Nov 2022 17:54:11 GMT

@Noah-Sager

I've been able to iterate and flatten the collection, however, when I try calling Fields I'm getting a "null" and "undefined." For proof on concept, I've just been trying to call fields[0] to populate a pop-up. Do you know why it wouldn't be grabbing the field attributes? Here is the documentation I am currently following:

// print the first Sublayer's first field to the console console.log(mapImageLayer.sublayers.items[0].fields[0]); // OUTPUT: alias: "OBJECTID" defaultValue: undefined description: "the objectid" domain: null editable: false length: -1 name: "objectid" nullable: false type: "oid" valueType: null