AnsweredAssumed Answered

Not able to Select a GeoJson FeatureLayer with Select Widget in Web AppBuilder

Question asked by cjmtk_rick on Jun 5, 2020

I am using the ArcGIS API for JavaScript 3.32 for the development of widgets in Web AppBuilder.  I have created a locally hosted GeoJson Feature Collection and instantiated it as a FeatureLayer in code (see code snippet below).

 

The issue I am having is that after the FeatureLayer is displayed on my Web AppBuilder map, I an unable to select it using the Select Widget unlike other MapService layers (that are comprised of shapefiles - see screenshot below).  Any information on why this is the case and how to make the FeatureLayer selectable would be helpful.

 

// Add geojon layer code here
          require([
            "esri/symbols/SimpleFillSymbol","esri/symbols/SimpleLineSymbol",
            "esri/geometry/Polygon", "esri/graphic", "esri/Color", "esri/layers/FeatureLayer"
          ], lang.hitch(this, function(SimpleFillSymbol, SimpleLineSymbol, Polygon, Graphic, Color, FeatureLayer) {

            var sfs = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,
              new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASHDOT,
                new Color([255, 0, 0]), 2), new Color([255, 255, 0, 0.25])
            );

            // First we create an empty feature collection:
            var featureCollection = {
              "layerDefinition": null,
              "featureSet": {
                "features": [],
                "geometryType": "esriGeometryPolygon"
              }
            };

            //give the feature collection a layer definition:
            featureCollection.layerDefinition = {
              "geometryType": "esriGeometryPolygon",
              "objectIdField": "ObjectID",
              "drawingInfo": {
                "renderer": {
                  "type": "simple",
                  "symbol": {
                    "type": "esriSFS",
                    "style": "esriSFSNull",
                    "color": [
                      31,
                      121,
                      180,
                      255
                    ],
                    "outline": {
                      "type": "esriSLS",
                      "style": "esriSLSSolid",
                      "color": [31, 121, 180, 255], //110, 110, 110, 255
                      width: 0.4
                    }
                  }
                }
              },
              "fields": [{
                  "name": "OBJECTID",
                  "type": "esriFieldTypeOID",
                  "alias": "OBJECTID"
                },
                {
                  "name": "RectangleID",
                  "type": "esriFieldTypeString",
                  "alias": "RectangleID",
                  "length": 10
                },
                {
                  "name": "section",
                  "type": "esriFieldTypeString",
                  "alias": "section",
                  "length": 2
                },
                {
                  "name": "lot",
                  "type": "esriFieldTypeString",
                  "alias": "lot",
                  "length": 3
                },
                {
                  "name": "space",
                  "type": "esriFieldTypeString",
                  "alias": "space",
                  "length": 4
                },
                {
                  "name": "spaceid",
                  "type": "esriFieldTypeString",
                  "alias": "spaceid",
                  "length": 10
                },
                {
                  "name": "Shape_Length",
                  "type": "esriFieldTypeDouble",
                  "alias": "Shape_Length"
                },
                {
                  "name": "Shape_Area",
                  "type": "esriFieldTypeDouble",
                  "alias": "Shape_Area"
                }
              ]
            };
            //featureCollection object is in the correct format to be passed in to a FeatureLayer:

            featureLayer = new FeatureLayer(featureCollection, {
              id: 'myFeatureLayer',
              // fields: fields, // This is required when creating a layer from Graphics
              ObjectIdField: "OBJECTID", // This must be defined when creating a layer from Graphics
              spatialReference: {
                wkid: 4326
              },
              mode: FeatureLayer.MODE_AUTO  // was MODE_ONDEMAND
            });

            function requestData() {
              var requestHandle = esriRequest({
                url: "url to local json file (generalized for privacy)", 
                callbackParamName: "jsoncallback"
              });
              requestHandle.then(requestSucceeded, requestFailed);
            }

            function requestSucceeded(response, io) {
              //loop through the items and add to the feature layer
              var features = [];
              array.forEach(response.features, function(item) {
               var attr = {};
                //pull in any additional attributes if required
                attr["section"= item.properties.section;
                var geometry = new Polygon({
                  rings: item.geometry.coordinates
                });
                var graphic = new Graphic(geometry);
                graphic.setAttributes(attr);
                features.push(graphic);
              });
              featureLayer.applyEdits(features, null, null);
            }

            function requestFailed(error) {
              console.log('add geojson feature layer failed');
            }
            debugger;
            map.addLayers([featureLayer]);
            map.on('layer-add-result', requestData);
          }));
          // end geojson layer code

 

FeatureLayer on the web map:

 

FeatureLayer (Smaller Scale):

 

Screenshot showing that FeatureLayer is not selected by the Select Tool unlike other shapefile mapservices (blacked out FeatureLayer shows "0" selected features):

 

Select Widget Config (apologizes for the low res image):

 

 

Snippet of Feature Collection json file that was made into the FetureLayer:

{
  "type" : "FeatureCollection",
  "crs" : {
    "type" : "name",
    "properties" : {
      "name" : "EPSG:4326"
    }
  },
  "features" : [
    {
      "type" : "Feature",
      "id" : 1,
      "geometry" : {
        "type" : "Polygon",
        "coordinates" : [
          [
            [
              -116.88121827430388,
              34.954987221383192
            ],
            [
              -116.88121827430388,
              34.941176479311139
            ],
            [
              -116.86294416274291,
              34.941176479311139
            ],
            [
              -116.86294416274291,
              34.954987221383192
            ],
            [
              -116.88121827430388,
              34.954987221383192
            ]
          ]
        ]
      },
      "properties" : {
        "OBJECTID" : 1,
        "Filename" : "Path to the Map Data (generalized for privacy)",
        "Shape_Length" : 0.064169707266046316,
        "Shape_Area" : 0.00025237904136448075,
        "ProductName" : "My Map Data"
      }
    },

Outcomes