topic Help with Draw and InfoTemplate in ArcGIS JavaScript Maps SDK Questions

Help with Draw and InfoTemplate

KevinHanley2 — Tue, 12 Feb 2019 18:28:32 GMT

Currently I'm using an ArcGISDynamicMapServiceLayer along with an InfoTemplate assigned to it, so when I single click on any portion of my map, it returns the InfoTemplate that includes a few fields from whichever parcel I clicked on.

var infoTemplate = new InfoTemplate("${PIN_DSP}","<b>${OWNER_NAME}</b>");

var parcelsLayer = new ArcGISDynamicMapServiceLayer("http://172.27.8.54/okaloosagis/rest/services/PropertyApp/ParcelService/MapServer", {
"id": "Parcels",
"visible": true,
disableClientCaching: true,
useMapImage: true
});

parcelsLayer.setInfoTemplates({
14: {infoTemplate: infoTemplate}
})

I was moving on to the next step, which would be using some sort of Draw feature to select more than one location at a time, and return the same information for every parcel the geometry included. Right now I have a rectangle drawing on screen using the Draw Toolbar option, but I'm trying to find some more information on taking this geometry and using it to return said data. Can anyone direct me to an example, or anything that might help me learn more? I'm pretty new at this, so reading the API Reference for both the InfoTemplates and Draw Toolbars didn't help me too much, but it could be that I don't fully understand it in the terminology they're using.

Here's my drawing routines, just for some more info.

function initToolbar() {
tb = new Draw(map);
tb.on("draw-end", addSpatialInfoTemplate);

// event delegation so a click handler is not
// needed for each individual button
on(dom.byId("doExtent"), "click", function(evt) {
if ( evt.target.id === "doExtent" ) {
return;
}
map.disableMapNavigation();
tb.activate(Draw.EXTENT);
});
}

function addSpatialInfoTemplate(evt) {
//deactivate the toolbar and clear existing graphics
tb.deactivate();
map.enableMapNavigation();
//trigger infoTemplate here
}

Thank you!

Re: Help with Draw and InfoTemplate

RobertScheitlin__GISP — Tue, 12 Feb 2019 18:34:56 GMT

Kevin,

What you need to do is take the drawn geometry and use it as the geometry in a Query class that is executed on a QueryTask. The QueryTask will return the intersected results and then you can show a popup for those results.

Re: Help with Draw and InfoTemplate

KevinHanley2 — Wed, 13 Feb 2019 20:48:19 GMT

Can you tell me if I'm on the right track? (Will post full code if needed). It seems to be drawing correctly, but the query is returning undefined and I'm not quite sure where I'm going wrong. I suspect query.geometry = evt.geometry is wrong, but I might be way off.

map.on("load", initToolbar);

function initToolbar() {
tb = new Draw(map);
tb.on("draw-end", addGraphic);

var infoTemplate = new InfoTemplate("${PIN_DSP}","<b>${OWNER_NAME}</b>");

query = new Query();
query.returnGeometry = true;
query.outFields = ["PIN_DSP", "OWNER_NAME"];

queryTask = new esri.tasks.QueryTask("http://172.27.8.54/okaloosagis/rest/services/PropertyApp/ParcelService/MapServer/14");

function addGraphic(evt) {
//deactivate the toolbar and clear existing graphics
tb.deactivate();
map.enableMapNavigation();

var symbol;
if ( evt.geometry.type === "point" || evt.geometry.type === "multipoint") {
symbol = markerSymbol;
} else if ( evt.geometry.type === "line" || evt.geometry.type === "polyline") {
symbol = lineSymbol;
}
else {
symbol = fillSymbol;
}

map.graphics.add(new Graphic(evt.geometry, symbol));
query.geometry = evt.geometry;

queryTask.execute(query, function(fset) {
showFeatureSet(fset,evt);
})
}

function showFeatureSet(fset,evt) {
map.graphics.clear();
featureSet = fset;
var numFeatures = featureSet.features.length;

var content = "";
for (var i=0; i<numFeatures; i++) {
var graphic = featureSet.features;
content = content + graphic.attributes.FIELD_NAME;
}

map.infoWindow.setContent(content);
map.infoWindow.show(evt.screenPoint);
}

Re: Help with Draw and InfoTemplate

RobertScheitlin__GISP — Wed, 13 Feb 2019 21:06:41 GMT

Kevin,

So on this line

query.geometry = evt.geometry;

it is complaining that query is undefined?

That line is correct.

Re: Help with Draw and InfoTemplate

KevinHanley2 — Wed, 13 Feb 2019 21:28:36 GMT

No, it isn't throwing any errors. I was just assuming that might be the issue since that was a line I didn't see in any of the live examples given in the API reference.

It's just returning undefined/undefined in the InfoWindow. (So clearly it is getting the number of returns correct, but not the actual data itself, which is curious).

Re: Help with Draw and InfoTemplate

RobertScheitlin__GISP — Sat, 11 Dec 2021 10:56:57 GMT

OK. So console.log some info inside your for loop to see if you are getting the features.

for (var i=0; i<numFeatures; i++) {
  var graphic = featureSet.features[i];
  console.info(graphic);
  content = content + graphic.attributes.FIELD_NAME;
}
console.info(content);‍‍‍‍‍‍