Add graphic to query result

Anonymous User — Sat, 11 Dec 2021 13:30:47 GMT

I have some code that zooms to a query result extent, but I also want to highlight the query result. Console shows I'm returning an object but i cant seem to add the "highlightSymbol" to it. Any help is much appreciated:

  //Highlight Symbol
  var highlightSymbol = new SimpleFillSymbol(
  SimpleFillSymbol.STYLE_SOLID,
  new SimpleLineSymbol(
  SimpleLineSymbol.STYLE_SOLID,
  new Color([255, 0, 0]), 3),
  new Color([125, 125, 125, 0.2]));

  //Query BLOCK/LOT
  var queryTask = new QueryTask(parcels.url);

  var query = new Query();
  query.returnGeometry = true;
  query.outFields = ["*"];
  on(dom.byId("execute"), "click", execute);

  function execute() {
  map.graphics.clear();

  query.where = "SSN = '" + dijit.byId("muniSelect").value + "' AND BLOCK = '" + dom.byId("block").value + "' AND LOT = '" + dom.byId("lot").value + "'";
  queryTask.execute(query, showResults);
  }
  function showResults(results) {
  var resultItems = [];
  var resultCount = results.features.length;
  for (var i = 0; i < resultCount; i++) {
  var featureAttributes = results.features.attributes;
  for (var attr in featureAttributes) {
  resultItems.push("<b>" + attr + ":</b>  " + featureAttributes[attr] + "<br>");
  }
  resultItems.push("<br>");
  }
  if (resultCount === 0) {
  dom.byId("info").innerHTML = "<h3 style = 'color:#E60000'> No Record Found </h1>";
  } else {
  dom.byId("info").innerHTML = resultItems.join("");

  //Zoom to Result & Set Query Result Symbol
  var resultGraphic = new Graphic(results.features, highlightSymbol);
  var resultExtent = graphicsUtils.graphicsExtent(results.features);
  map.graphics.add(resultGraphic);
  map.setExtent(resultExtent.expand(2));

  console.log("resultGraphic:", (results.features));
  }
  }

Re: Trying to add graphic to query result

JakeSkinner — Sat, 11 Dec 2021 13:30:50 GMT

Hi Ian,

I don't believe you will be able to pass an object to the geometry property of the Graphic class. You can iterate through the features array of the object and then apply the highlight symbol to each feature. Ex:

function highlightResults(results){
  array.map(results.features, function (result) {
   var graphic = result;
   graphic.setSymbol(pointHighlightSymbol);
   map.graphics.add(graphic);
  });

  var resultExtent = graphicsUtils.graphicsExtent(results.features);  
  map.setExtent(resultExtent.expand(2)); 

}

Here is a JS Fiddle that demonstrates this. After clicking on a county, the cities within the county will be selected and then zoomed to.

topic Re: Trying to add graphic to query result in ArcGIS JavaScript Maps SDK Questions

Add graphic to query result

Re: Trying to add graphic to query result