featurelayers.graphics

DamNguyen · ‎03-09-2016

Hi guys,

I'm working on a map that uses FeatureLayer.Mode_ONDEMAND. To see certain layer, I pass in a project ID using featureLayer.setDefinitionExpression. Where such layer exists, I see it. What I want to know is how to detect when no layer exists. I want to print an alert to the viewer instead of showing just a blank map. Here's my code:

function init() {

map = new esri.Map("mapDiv", {

basemap: "topo",

center: [-116.73536, 33.033989],

zoom: 9

});

var featureLayer = new esri.layers.FeatureLayer("http://services.arcgis.com/v01gqwM5QqNysAAi/arcgis/rest/services/Project_boundaries_021616/FeatureSe...",{

mode: esri.layers.FeatureLayer.MODE_ONDEMAND,

outFields: ["*"],

opacity: 1

});

featureLayer.setDefinitionExpression("SrvyDescID=\'' . htmlspecialchars($ProjectID) . '\'");

console.log(featureLayer.graphics);

console.log(featureLayer.graphics[0]);

map.addLayer(featureLayer);

}

What I learned is when the project is valid, feature.graphics will return an array. But I'm unable to treat it like an array. For example, featureLayer.graphic[0] returns "undefined". featureLayer.graphic.length also doesn't work. And yet, my console.log does return an object. How do I detect this object?

Attached is a screenshot of the console log. Thanks for your help.

DamNguyen · ‎03-09-2016

It turns out, instead of catching layer-add-result event, I needed to catch update-end event.

This is what I ended up with:

map = new esri.Map("mapDiv", {
center: [-118.30, 34.3],
zoom: 8,
basemap: "topo"
});

on(map, "update-end", function(){   // update-end event will execute after the layer has been added to the map
      if(featureLayer.graphics.length >= 1)
      {
          // do your thing here
      }
})

var featureLayer = new esri.layers.FeatureLayer("http://services.arcgis.com/v01gqwM5QqNysAwas/arcgis/rest/services/Project_boundaries_021616/FeatureS...",{
      mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
      outFields: ["*"],
      opacity: 1
});
featureLayer.setDefinitionExpression("SrvyDescID=\'' . htmlspecialchars($SDID) . '\'");
map.addLayer(featureLayer);

View solution in original post

thejuskambi · ‎03-09-2016

In OnDemand mode, the graphics are update when the map changes extent i.e, Zoom or pan. You need to do featurelayer.refresh to the the data.

Also, you need to added to map before checking any graphics.

DamNguyen · ‎03-09-2016

I added a featureLayer.refresh(); line before printing it to console.log and nothing changes.

featureLayer.setDefinitionExpression("SrvyDescID=\'' . htmlspecialchars($SDID) . '\'");

featureLayer.refresh();

console.log(featureLayer.graphics);

console.log(featureLayer.graphics[0]);

map.addLayer(featureLayer);

thejuskambi · ‎03-09-2016

Like I updated the comment, you need to add the layer to the map before using it.

DamNguyen · ‎03-09-2016

this is my code:

console.log(featureLayer.graphics);

map.addLayer(featureLayer);

console.log(featureLayer.graphics);

Both output look the same. Do I need to do anything after the line map.addLayer(featureLayer)?

thejuskambi · ‎03-09-2016

you need to wait till the layer is loaded in the map.
Use the map's layer-add-result event and then check for the contents.

on(map, "layer-add-result", function(layer){

console.log(layer.graphics[0]);

});

or you could watch the FeatureLayer's update event. Update event is fired when the layer completes fetching the data from the server.

DamNguyen · ‎03-09-2016

New code:

var map;
require([
"esri/map", "esri/layers/FeatureLayer",
"dojo/on", "dojo/domReady!"
], function(
Map, FeatureLayer,
on
) {
map = new esri.Map("mapDiv", {
   basemap: "topo",
   center: [-116.73536, 33.033989],
   zoom: 9
});

on(map, "layer-add-result", function(){
   console.log(featureLayer.graphics[0])
})

var featureLayer = new esri.layers.FeatureLayer("http://services.arcgis.com/v01gqaf3wM5ysAAi/arcgis/rest/services/Project_boundaries_021616/FeatureSe...",{
mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
outFields: ["*"],
opacity: 1
});
featureLayer.setDefinitionExpression("SrvyDescID=\'' . htmlspecialchars($SDID) . '\'");
map.addLayer(featureLayer);
});

Console.log is still returning featureLayer.graphics[0] as undefined.

DamNguyen · ‎03-09-2016

It turns out, instead of catching layer-add-result event, I needed to catch update-end event.

This is what I ended up with:

map = new esri.Map("mapDiv", {
center: [-118.30, 34.3],
zoom: 8,
basemap: "topo"
});

on(map, "update-end", function(){   // update-end event will execute after the layer has been added to the map
      if(featureLayer.graphics.length >= 1)
      {
          // do your thing here
      }
})

var featureLayer = new esri.layers.FeatureLayer("http://services.arcgis.com/v01gqwM5QqNysAwas/arcgis/rest/services/Project_boundaries_021616/FeatureS...",{
      mode: esri.layers.FeatureLayer.MODE_ONDEMAND,
      outFields: ["*"],
      opacity: 1
});
featureLayer.setDefinitionExpression("SrvyDescID=\'' . htmlspecialchars($SDID) . '\'");
map.addLayer(featureLayer);