topic Re: Query layer and return only the graphics selected in ArcGIS JavaScript Maps SDK Questions

Query layer and return only the graphics selected

AlexGole1 — Fri, 27 Jun 2014 15:34:27 GMT

Hi all,

I am trying to create an application that allows users to query a layer and return only the graphics based on their selection, not only highlight the selected graphics.

Form instance, In my case, I want to query by users. As shown below I have a blue hashed polygon that represents Calmap users, in red I have "unknown users". My goal here is therefore to create a simple query that only returns the blue hashed polygon or red hashed polygon.

I have used this example but first it returns an error and also it will not return the exact same symbology as the feature layer I am using (is there a way to do that?).

  var gp, map, toc, dynaLayer1, query, queryTask;    var geocoder;       var symbol, infoTemplate, extractMethod;       var AOI, graphic, clipFeatureSet, clipFeature;       require(["dojo/_base/connect",          "dojo/dom", "dojo/dom-style", "dojo/parser", "dojo/on", "dojo/_base/Color",          "esri/map", "esri/config",          "esri/dijit/HomeButton",          "esri/dijit/BasemapGallery",          "esri/dijit/Bookmarks",          "esri/dijit/Scalebar",          "esri/geometry/Extent",          "esri/tasks/query", "esri/tasks/QueryTask",          "esri/layers/FeatureLayer",          "esri/layers/ArcGISTiledMapServiceLayer",          "esri/layers/ArcGISDynamicMapServiceLayer",          "esri/symbols/SimpleFillSymbol",          "esri/symbols/SimpleLineSymbol",          "esri/InfoTemplate",    "esri/tasks/FeatureSet",    "esri/graphic",          "agsjs/dijit/TOC",          "dijit/registry",          "dijit/layout/BorderContainer",          "dijit/layout/ContentPane",          "dijit/layout/AccordionContainer",          "dijit/TitlePane",          "dijit/form/CheckBox",          "dijit/form/ComboBox",          "dojo/parser",          "dijit/Toolbar",          "dijit/form/DropDownButton",    "dijit/layout/TabContainer",          "dijit/form/TextBox",          "dijit/TooltipDialog",          "dijit/ToolbarSeparator",          "dojo/domReady!"       ], function (connect, dom, domStyle, parser, on, Color,          Map, esriConfig, HomeButton, BasemapGallery, Bookmarks, Scalebar, Extent, Query, QueryTask, FeatureLayer, ArcGISTiledMapServiceLayer, ArcGISDynamicMapServiceLayer,          SimpleFillSymbol, SimpleLineSymbol, InfoTemplate, FeatureSet, Graphic,          TOC, registry) {           // call the parser to create the dijit layout dijits          parser.parse(); // note djConfig.parseOnLoad = false;           // Specify where the location of the proxy to use to communicate with the extract GP service.          esriConfig.defaults.io.proxyUrl = "/proxy";            // Keep a reference to the loading icon DOM node.          var loading = dom.byId("loading");                     map = new Map("map", {             logo: true,             sliderPosition: "top-right",             basemap: "topo",             center: [-121.469, 38.556],             zoom: 8          });           var home = new HomeButton({             map: map          }, "HomeButton");          home.startup();           var basemapGallery = new BasemapGallery({             showArcGISBasemaps: true,             map: map          }, "basemapGallery");          basemapGallery.startup();                  var bookmarks = new Bookmarks({             map: map,             bookmarks: [],             editable: true          }, dom.byId('bookmarks'));           var scalebar = new Scalebar({             map: map,             // "dual" displays both miles and kilmometers             // "english" is the default, which displays miles             // use "metric" for kilometers             scalebarUnit: "dual",             scalebarStyle: "ruler",             attachTo: "bottom-left"          });           dynaLayer1 = new ArcGISDynamicMapServiceLayer("http://webgisdevint1/arcgis/rest/services/Alex_Try/Archived/MapServer", {});           map.on('layers-add-result', function (evt) {             dynaLayer1.setVisibleLayers([1, 2, 4]);             toc = new TOC({                map: map,                layerInfos: [{                   layer: dynaLayer1,                   title: "Layers",                   slider: true                }]             }, 'tocdiv');             toc.startup();          });          map.addLayers([dynaLayer1]);            symbol = new SimpleFillSymbol(SimpleFillSymbol.STYLE_SOLID,             new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color([111, 0, 255]), 2), new Color([255, 255, 0, 0.25]));          infoTemplate = new InfoTemplate("${OBJECTID}", "${*}");           registry.byId("query").on("click", executeQuery);           function executeQuery(name) {                 var name = document.getElementById("user").value       var queryTask = new QueryTask("http://webgisdevint1/arcgis/rest/services/Alex_Try/Archived/MapServer/0");             queryTask.on("complete", showResults)    var query = new Query();             query.returnGeometry = true;             query.outFields = ["LAST_EDITED_USER"];             query.where = "LAST_EDITED_USER = '" + name + "'";             query.outSpatialReference = map.spatialReference;             queryTask.execute(query, showResults);    }           function showResults(featureSet) {          //remove all graphics on the maps graphics layer          map.graphics.clear();           //Performance enhancer - assign featureSet array to a single variable.          var resultFeatures = featureSet.features;           //Loop through each feature returned          for (var i=0, il=resultFeatures.length; i<il; i++) {          //Get the current feature from the featureSet.          //Feature is a graphic          var graphic = resultFeatures;          graphic.setSymbol(symbol);           //Set the infoTemplate.          graphic.setInfoTemplate(infoTemplate);           //Add graphic to the map graphics layer.          map.graphics.add(graphic);         }        }

The error I get is:

"Cannot read property 'length' of undefined"

Thank you,
Alex

[ATTACH=CONFIG]34956[/ATTACH]

Re: Query layer and return only the graphics selected

MichaelVolz — Fri, 27 Jun 2014 15:56:22 GMT

Do you have a public sample of this website that can be run?

Can you check that name is getting populated correctly as I assume it is from some type of user input?

Re: Query layer and return only the graphics selected

AlexGole1 — Fri, 27 Jun 2014 16:01:11 GMT

Do you have a public sample of this website that can be run?

Can you check that name is getting populated correctly as I assume it is from some type of user input?

Let me make it public.

Re: Query layer and return only the graphics selected

AlexGole1 — Fri, 27 Jun 2014 17:15:15 GMT

http://testegis.fire.ca.gov/history_public/history_public.html

Here is my public app.

Alex

Re: Query layer and return only the graphics selected

MichaelVolz — Fri, 27 Jun 2014 17:59:04 GMT

Can you make your mapservice(s) public as well as I cannot get to the Rest endpoint?

Re: Query layer and return only the graphics selected

AlexGole1 — Fri, 27 Jun 2014 18:10:15 GMT

Sorry, give it a shot now.

Re: Query layer and return only the graphics selected

MichaelVolz — Fri, 27 Jun 2014 18:43:17 GMT

Did you ever try running the sample with ESRI's data? Did the sample work with their data?

I'm not really sure why featureSet.features is undefined as I see features populated in the console of Firebug.

I will try to modify ESRI's sample to use my data to see if I can get it to work (as I can use it for my applications), which might help determine why this variable is undefined and giving you the error.

Re: Query layer and return only the graphics selected

AlexGole1 — Fri, 27 Jun 2014 18:51:16 GMT

Did you ever try running the sample with ESRI's data? Did the sample work with their data?

I'm not really sure why featureSet.features is undefined as I see features populated in the console of Firebug.

I will try to modify ESRI's sample to use my data to see if I can get it to work (as I can use it for my applications), which might help determine why this variable is undefined and giving you the error.

No I have not. I am only using a portion of the ESRI code found here:

https://developers.arcgis.com/javascript/jshelp/intro_querytask.html

I dont understand why this returns an "undefinded" error message error either.

Let me know if it works for you.

I know I should proceed one step at a time but , if ever, you have any idea how to keep the original symbology of the feature layer after the query is returned, that would be great.

Thank you,
Alex

Re: Query layer and return only the graphics selected

YungKaiChin — Sat, 11 Dec 2021 20:11:36 GMT

Have you tried nest the function within?
Ex:

queryTask.execute(query, function(featureSet) { alert(featureSet.length);});

See if you get anything.

Re: Query layer and return only the graphics selected

AlexGole1 — Sat, 11 Dec 2021 20:11:39 GMT

Have you tried nest the function within?
Ex:
queryTask.execute(query, function(featureSet) { alert(featureSet.length);});
See if you get anything.

Ok I am trying your idea right now:

function executeQuery(name) {
            
   var name = document.getElementById("user").value   
   var queryTask = new QueryTask("http://webgisdevint1/arcgis/rest/services/Alex_Try/Archived/MapServer/0");
            queryTask.on("complete", showResults)
   var query = new Query();
            query.returnGeometry = true;
            query.outFields = ["LAST_EDITED_USER"];
            query.where = "LAST_EDITED_USER = '" + name + "'";
            query.outSpatialReference = map.spatialReference;
            queryTask.execute(query, showResults(featureSet) { alert(featureSet.length);});
   }

         function showResults(featureSet) {
         //remove all graphics on the maps graphics layer
         map.graphics.clear();

         //Performance enhancer - assign featureSet array to a single variable.
         var resultFeatures = featureSet.features;

         //Loop through each feature returned
         for (var i=0, il=resultFeatures.length; i<il; i++) {
         //Get the current feature from the featureSet.
         //Feature is a graphic
         var graphic = resultFeatures;
         graphic.setSymbol(symbol);

         //Set the infoTemplate.
         graphic.setInfoTemplate(infoTemplate);

         //Add graphic to the map graphics layer.
         map.graphics.add(graphic);
        }
       }

I get a common error of:

Uncaught SyntaxError: Unexpected token {

what am I doing wrong here?

Re: Query layer and return only the graphics selected

AlexGole1 — Fri, 27 Jun 2014 19:52:34 GMT

Disregard the last message.

Re: Query layer and return only the graphics selected

YungKaiChin — Sat, 11 Dec 2021 20:11:42 GMT

Your codes may have multiple problems, but first off, ...

Change from

queryTask.execute(query, showResults(featureSet) { alert(featureSet.length);});

queryTask.execute(query, function(featureSet) { alert(featureSet.length);});

Then, you can start from there.

Re: Query layer and return only the graphics selected

AlexGole1 — Sat, 11 Dec 2021 20:11:44 GMT

Your codes may have multiple problems, but first off, ...

Change from
queryTask.execute(query, showResults(featureSet) { alert(featureSet.length);});
To
queryTask.execute(query, function(featureSet) { alert(featureSet.length);});
Then, you can start from there.

Ok. well same error.

http://testegis.fire.ca.gov/history_public/history_public.html

Re: Query layer and return only the graphics selected

YungKaiChin — Fri, 27 Jun 2014 20:06:00 GMT

1. Did you see any popup with a number?

2. To limit other errors, you can comment all codes afterward.

Re: Query layer and return only the graphics selected

AlexGole1 — Fri, 27 Jun 2014 20:11:09 GMT

1. Did you see any popup with a number?

2. To limit other errors, you can comment all codes afterward.

No nothing happens...

you can verify on my public app here:

http://testegis.fire.ca.gov/history_...ry_public.html

Re: Query layer and return only the graphics selected

YungKaiChin — Fri, 27 Jun 2014 20:19:47 GMT

Sorry. Just found a mistake in my own code. 😛

It should be featureSet.features.length instead.
Nevertheless, if you don't see any popup, it means the problem is above that line of code.

Re: Query layer and return only the graphics selected

TracySchloss — Sat, 11 Dec 2021 20:11:47 GMT

You shouldn't combine a queryTask.on('complete', showResults) with a queryTask.execute(query, function ....). You have already specified your results handler, putting something different in the execute line just confuses things.

Also, if you execute with a listener on the 'complete' event, I believe the resultant output is generically 'results' and not a featureSet. You end up having to change your code up slightly to get to the featureSet, something like

function showResults(results) {
var features = results.featureSet.features
....

Pay attention to what is really getting returned from your query handler, I don't think it's a featureSet.

Re: Query layer and return only the graphics selected

AlexGole1 — Sat, 11 Dec 2021 20:11:50 GMT

You shouldn't combine a queryTask.on('complete', showResults) with a queryTask.execute(query, function ....). You have already specified your results handler, putting something different in the execute line just confuses things.

Also, if you execute with a listener on the 'complete' event, I believe the resultant output is generically 'results' and not a featureSet. You end up having to change your code up slightly to get to the featureSet, something like
function showResults(results) {
var features = results.featureSet.features
....
Pay attention to what is really getting returned from your query handler, I don't think it's a featureSet.

Ok,
I removed queryTask.on and modified the code as explained below but still get and error:

"results i not defined"

You can access my app modified here

Alex

Re: Query layer and return only the graphics selected

TracySchloss — Fri, 27 Jun 2014 20:43:49 GMT

If you're going to remove the queryTask.on ('complete', handlerFunction), and stick with queryTask.execute(query, handlerFunction) then you want to leave your showResults function as

function showResults(featureSet){ var features = featureSet.features;

If you want to want to go with

queryTask.execute(query, handlerFunction);

That's where you'd have your results function as

function showResults (results) { var features = results. featureSet.features;

I also think your for statement looks a little weird. Maybe it should be

for (var i=0; i<features.length; i++){

Re: Query layer and return only the graphics selected

AlexGole1 — Sat, 11 Dec 2021 20:11:53 GMT

If you're going to remove the queryTask.on ('complete', handlerFunction), and stick with queryTask.execute(query, handlerFunction) then you want to leave your showResults function as
function showResults(featureSet){
var features = featureSet.features;
If you want to want to go with
queryTask.execute(query, handlerFunction);
That's where you'd have your results function as
function showResults (results) {
var features = results. featureSet.features;
I also think your for statement looks a little weird. Maybe it should be
for (var i=0; i<features.length; i++){

Thank you that was it! I just needed to remove query task.on.

Thanks again!