topic Re: Get FeatureLayer Attribute by Clicking in ArcGIS JavaScript Maps SDK Questions

Get FeatureLayer Attribute by Clicking

XuanKuai1 — Sat, 11 Dec 2021 20:35:30 GMT

I'm using ArcGIS API for JavaScript 4.8. My goal is to get the Census tract ID value of the clicked Feature in a FeatureLayer and display the ID value in an alert box. I got stuck when trying to use Query/QueryTask to fetch the value. My code goes here:

require([
    "esri/Map",
    "esri/views/MapView",
    "esri/layers/FeatureLayer",
    "esri/layers/GroupLayer",
    "esri/widgets/LayerList",
    "esri/tasks/support/Query",
    "esri/tasks/QueryTask",
    "dojo/on",
    "dojo/domReady!"
  ],
  function(
    Map, MapView, FeatureLayer, GroupLayer, LayerList, Query, QueryTask, on
  ) {
    var map = new Map({
      basemap: "topo"
    });

    var view = new MapView({
      center: [-91.05, 30.5161109],
      zoom: 11,
      container: "viewDiv",
      map: map,
    });

    // Generate link to Census tract details
    view.when(function() {
      on(view, "click", displayTractID);
    });

    function displayTractID(event) {
      // TODO
    }

    // Define popup template and get feature layers
    var census2000Template = {
      title: "Census 2000",
      content: [{
        type: "fields",
        fieldInfos: [{
          fieldName: "TRACT",
          label: "Tract",
          visible: true
        }, {
          fieldName: "POPULATION",
          label: "Population",
          visible: true,
          format: {
            digitSeparator: true,
            places: 0
          }
        }]
      }]
    };

    var census2000Layer = new FeatureLayer({
      url: "http://services.arcgis.com/KYvXadMcgf0K1EzK/ArcGIS/rest/services/Census_2000/FeatureServer/0",
      outFields: ["*"],
      popupTemplate: census2000Template
    });

    // Add feature layers to a group layer
    var censusGroupLayer = new GroupLayer({
      title: "Historic Census",
      visible: true,
      visibilityMode: "exclusive",
      layers: [census2000Layer]
    });

    map.add(censusGroupLayer);
  });‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Could someone help me to fill out the TODO part or show me some sandbox examples?

Re: Get FeatureLayer Attribute by Clicking

RobertScheitlin__GISP — Sat, 11 Dec 2021 20:35:32 GMT

Xuan,

Here is how you do that using view.hitTest.

// Get the screen point from the view's click event
view.on("click", function (event) {
 var screenPoint = {
   x: event.x,
   y: event.y
 };

 // Search for graphics at the clicked location
 view.hitTest(screenPoint).then(function (response) {
  if (response.results.length) {
   var graphic = response.results.filter(function (result) {
    // check if the graphic belongs to the layer of interest
    return result.graphic.layer === myLayer;
   })[0].graphic;
   // do something with the result graphic
   console.log(graphic.attributes);
  }
 });
});‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Re: Get FeatureLayer Attribute by Clicking

XuanKuai1 — Mon, 30 Jul 2018 18:51:24 GMT

I think that's a pretty smart workaround. What exactly should I put in place of myLayer at your line 13? Should it be the layer name displayed in the title of the REST page of the layer?

Re: Get FeatureLayer Attribute by Clicking

RobertScheitlin__GISP — Mon, 30 Jul 2018 19:11:38 GMT

No it would be the actual layer object.

Re: Get FeatureLayer Attribute by Clicking

kolinn — Wed, 05 Jun 2019 03:44:35 GMT

Thank!!!

Robert Scheitlin

you saved my time.

Re: Get FeatureLayer Attribute by Clicking

ChetanPrajapati — Mon, 07 Sep 2020 12:59:57 GMT

var featureLayer = new FeatureLayer({
url: "https://services6.arcgis.com/qqlm5mJY5vXAZxEC/arcgis/rest/services/LalyerListWithHRBuild/FeatureServer",
});

Can i pass this object "featureLayer " in place of my layer?

 return result.graphic.layer === myLayer;

Re: Get FeatureLayer Attribute by Clicking

RobertScheitlin__GISP — Tue, 08 Sep 2020 03:11:58 GMT

yes

Re: Get FeatureLayer Attribute by Clicking

KenjooYeap — Wed, 11 Aug 2021 11:26:50 GMT

I do understand the docs correctly that from 4.6 onwards the attributes will only contain the ID and layer name? I am getting an object from graphics.attribute of {FID:int} only, do I have to then do a query based on this FID on the feature layer and get the attributes or is there another way for that?

In this example the attributes is still returning when I switch the api to 4.20, so I am guess I must have done something wrong?

Thanks for your help!

Using the following code:

view.on("click", (event)=> { view.hitTest(event.screenPoint,{include: allSchoolLayer}) .then(function (response) { if (response.results.length > 0) { console.log(response); var graphic = response.results.filter(function(result) { // check if the graphic belongs to the layer of interest return result.graphic.layer === allSchoolLayerCluster; })[0].graphic; // do something with the result graphic console.log(graphic.attributes); } }); })

Re: Get FeatureLayer Attribute by Clicking

KenjooYeap — Thu, 12 Aug 2021 07:20:49 GMT

The reason I was only getting the FID was because the outFields needs to be included in the featureLayer definition. Use outFields:["*"] to include all the feature.