Select to view content in your preferred language

Use of Features widget with featurelayer added to map.

375
1
Jump to solution
07-12-2023 02:01 PM
LefterisKoumis
Regular Contributor II

I posted the question of how to use the features widget with a feature layer (fL) added to the map (link ) and @LaurenBoyd  responded that you have to define the fL's popupTemplate before you can fetch the features. That was the correct response. However, in my case I have hundreds of layers that can be added to the map as the discretion of the user, therefore I'd like to use a default popup display for all layers. 

Prior version 4.12, you could simply use 

 

  popupTemplate: {
        title: "Title",
        content: "*"
    }

 

to define the popuptemplate. Since then, ESRI stated that: "As of version 4.12, content can no longer be set using a wildcard, e.g. *. Instead, set the Popup's defaultPopupTemplateEnabled property to true."

To use the defaultPopupTemplateEnabled you must first set the 

 

view.popup.popupEnabled = true

 

However, to use the features widget, you must set the above property to false.

So, to display all attributes of a fL in a popup I wrote this script (see below) to get all the fields of the feature layer and set the popuptemplate with those fields. It works but the format of the display is not satisfactory. See this codepen link and click on a feature to see the popup display. I'd love to get the table style format to display the results. Any ideas? 

 

reactiveUtils.on(
          () => view,
          "click",
          (event) => {
            featuresWidget.open({
              location: event.mapPoint,
              fetchFeatures: true
            });
            view.map.layers.map(function (lyr) {
              if (lyr.type === "feature"){
               let content =""
                console.log(lyr.fields)
                console.log(lyr)
                lyr.fields.forEach((field) => {
                  let alias = field.alias
                  let name = field.name
                  content += "<p>" + alias + ":{" + name + "}</p><br>"
                })
             
                console.log(content)
                var popupTemplate = { // autocasts as new PopupTemplate()
                    title: lyr.title,
                    content: content
                };               
                lyr.popupTemplate = popupTemplate;
              }

            })
          }
        );

 

 

 

0 Kudos
1 Solution

Accepted Solutions
UndralBatsukh
Esri Regular Contributor

Hi there, 

Instead of having to set the fields content yourself for the layer's popupTemplate, you can simply set the popupTemplate.content to fields content element. In the SDK doc, you will see examples of this.

In any case, I updated your codepen to set the fields content for the first layer: https://codepen.io/U_B_U/pen/gOQvmyY?editors=1000

Hope this helps,

-Undral

 

View solution in original post

0 Kudos
1 Reply
UndralBatsukh
Esri Regular Contributor

Hi there, 

Instead of having to set the fields content yourself for the layer's popupTemplate, you can simply set the popupTemplate.content to fields content element. In the SDK doc, you will see examples of this.

In any case, I updated your codepen to set the fields content for the first layer: https://codepen.io/U_B_U/pen/gOQvmyY?editors=1000

Hope this helps,

-Undral

 

0 Kudos