Adding Layer using esriRequest Response in ArcGIS API for JavaScript?

Question

For various reasons I need to add layers to a map object using a response returned by an esriRequest to an ArcGIS Server. One reason being the data will change constantly and hard coding FeatureLayer URLs would prove inefficient.

I have successfully been able to return a JSON object containing attribution that appears to be the same data one would see on the layers REST node.

 maps = [];

require([
    "esri/map", "esri/layers/FeatureLayer", 
    "esri/dijit/Print", "esri/tasks/PrintTemplate", "esri/request", 
    "esri/config","esri/dijit/BasemapToggle",

    "dojo/_base/array", "dojo/dom", "dojo/parser",  "dojo/domReady!"

], function (Map, FeatureLayer,Print, PrintTemplate, esriRequest,      esriConfig,BasemapToggle,arrayUtils, dom, parser){

parser.parse();

console.log("Map Start");

esriConfig.defaults.io.proxyUrl = "http://........./proxy.ashx";

maps.addRespLyrs = function addRespLyrs (layer) {
    if (layer.type == "Feature layer") {
        console.log(layer.name);
        maps.map.addLayer(layer);
    }
}; 

maps.handleMapInfo = function handleMapInfo (resp) {
    console.log("handleMapInfo called");
    maps.layers = resp.layers;
    console.log(maps.layers);
    for (i in maps.layers) {
        var layer = maps.layers[i];
        maps.addRespLyrs(layer);
    }
};

maps.layerRequest = function layerRequest () {
    var mapInfo = esriRequest({
        "url": "https://........./Application Name/MapServer/layers",
        "content" : {"f":"json"},
        "handleAs" : "json",
        "callbackParamName" : "callback"
    });
    mapInfo.then(maps.handleMapInfo);
};

maps.map = new Map("cpCentCent", {
    basemap:"topo",
    center: [-98.5795, 39.8282],
    zoom: 5
});


console.log("Map End");

When attempting to add the data using the addLayer() method I recieve an error thrown from deep with in esri's API.

init.js:199 TypeError: a.id.match is not a function(…) "TypeError: a.id.match is not a function

Any thoughts as to what could be going wrong here or how to create a layer from my JSON?

Answer 1

I think you need to be using esri/layers/FeatureLayer somewhere in here, because the maps.map.addLayer method is expecting a layer class as input. It looks like you're just passing in a json object instead of a layer class object.

Trap the URL from your esriRequest and build a new FeatureLayer from it, something like:

featLayer = new FeatureLayer(urlFromRequest);
maps.map.addLayer(featLayer);

Answer 2

While there may still be a better way of doing this, I was able to add layers by adding the following code using @Mintx 's advice..

    maps.addRespLyrs = function addRespLyrs (layer,layerURL) {
    console.log("addRespLys Called...");
    if (layer.type == "Feature Layer") {
        console.log(layer.name);
        console.log(layerURL);
        var featLayer = new FeatureLayer(layerURL);
        maps.map.addLayer(featLayer);
    }
}; 

maps.handleMapInfo = function handleMapInfo (resp) {
    console.log("handleMapInfo called");
    maps.layers = resp.layers;
    console.log(maps.layers);
    for (i in maps.layers) {
        var layer = maps.layers[i];
        //console.log(JSON.stringify(layer));
        var layerURL = maps.mapServerURL + "/" + layer.id;
        maps.addRespLyrs(layer,layerURL);
    }
};

maps.layerRequest = function layerRequest () {
    maps.mapServerURL= "https://....../MapServer"
    var mapInfo = esriRequest({
        "url": maps.mapServerURL + "/layers",
        "content" : {"f":"json"},
        "handleAs" : "json",
        "callbackParamName" : "callback"
    });
    mapInfo.then(maps.handleMapInfo);
};

What is being done in the above is to break out the URL's into chunks. There is a "main URL" (http://ArcGISServerURL.domain/webAdaptor/rest/services/NameOfService/MapServer) that we then append "/layers" to when making the esri request so that we can return all layers and their relevant information. From the generated response we can grab the layer ID and thus create a new feature layer by appending the "main URL" with the ID from the response. (http://ArcGISServerURL.domain/webAdaptor/rest/services/NameOfService/MapServer/id)

Answer 3

esri json to feature layer in 2018:

example arcgis rest api request url:

http://xxxx.com/xxx/rest/services/Maps_and_Indices/MapServer/2/query?f=pjson&returnCountOnly=false&outFields=*&outSR=4326&where=DISTRICT%20=%20%27129B149%27%20or%20TILE_NAME%20=%20%27129B149%27%20or%20TOOLTIP%20=%20%27129B149%27%20or%20NLA_URL%20=%20%27129B149%27

decode URL:

 http://xxxx.com/xxx/rest/services/Maps_and_Indices/MapServer/2/query?f=pjson&returnCountOnly=false&outFields=*&outSR=4326&where=DISTRICT = '129B149' or TILE_NAME = '129B149' or TOOLTIP = '129B149' or NLA_URL = '129B149'

data: any arcgis rest api return (response)

example (data) :

            {
             "displayFieldName": "TILE_NAME",
             "fieldAliases": {
              "OBJECTID": "OBJECTID",
              "DISTRICT": "DISTRICT",
              "TILE_NAME": "TILE_NAME",
              "TOOLTIP": "TOOLTIP",
              "NLA_URL": "NLA_URL"
             },
             "geometryType": "esriGeometryPolygon",
             "spatialReference": {
              "wkid": 4326,
              "latestWkid": 4326
             },
             "fields": [
              {
               "name": "OBJECTID",
               "type": "esriFieldTypeOID",
               "alias": "OBJECTID"
              },
              {
               "name": "DISTRICT",
               "type": "esriFieldTypeString",
               "alias": "DISTRICT",
               "length": 16
              },
              {
               "name": "TILE_NAME",
               "type": "esriFieldTypeString",
               "alias": "TILE_NAME",
               "length": 32
              },
              {
               "name": "TOOLTIP",
               "type": "esriFieldTypeString",
               "alias": "TOOLTIP",
               "length": 66
              },
              {
               "name": "NLA_URL",
               "type": "esriFieldTypeString",
               "alias": "NLA_URL",
               "length": 78
              }
             ],
             "features": [
              {
               "attributes": {
                "OBJECTID": 1120,
                "DISTRICT": "WESTLA",
                "TILE_NAME": "129B149",
                "TOOLTIP": "District: WESTLA\\nTile: 129B149",
                "NLA_URL": "navigatela/reports/cadastral_map_index.cfm?pk=129B149"
               },
               "geometry": {
                "rings": [
                 [
                  [
                   -118.45870522159555,
                   34.053800267113971
                  ],
                  [
                   -118.44549967992378,
                   34.053813128253687
                  ],
                  [
                   -118.44548872993352,
                   34.045569527150292
                  ],
                  [
                   -118.45869298464309,
                   34.045556665428208
                  ],
                  [
                   -118.45870522159555,
                   34.053800267113971
                  ]
                 ]
                ]
               }
              }
             ]
            }

For example you want add arcgis rest api response( esri json) to feature layer

var search_layer_result = JSON.parse(data)

    console.log(search_layer_result)

   // ............ add esri json -> feature layer -> map  ..............


  var featureCollection = {  
                      layerDefinition : search_layer_result,  
                      featureSet : search_layer_result 
                      }; 

 search_result_featureLayer = new FeatureLayer(featureCollection);  
//var symbol = new SimpleMarkerSymbol().setColor(new esri.Color([255,0,0,0.5]));  
 var renderer = new SimpleRenderer(your_Symbol);  
 search_result_featureLayer.setRenderer(renderer);  

 map.addLayer(search_result_featureLayer, your_layer_index_optional);