How to Link Query Results with Map Graphics

1794
6
Jump to solution
03-09-2017 12:44 PM
WilliamMiller4
Occasional Contributor II

Hello,

I'm working on a widget that takes user input, such as school district, sale date range, sale price range, etc., and uses esriRequest to pass those values to a non-ArcGIS rest service. The rest service puts the request in SQL format, queries a non-ArcGIS database and returns information, such as account number, address, sale date, sale price, buyer, seller, square footage, etc., on the parcels that match the user's parameters. A queryTask is performed to add a featureSet of the graphic to each result. Then a list of results are displayed in the widget and graphics are added to the Graphics Layer. Now I need the results in the list to link to the corresponding graphic so when it's click, the map zooms to the result on the map and displays its infoTemplate. How do I go about doing this? Should I add the graphics to a new layer? If so, would it be a FeatureLayer and how would I create it? I saw that FeatureLayers can be created from a featureCollection, but how do I create the layerDefinition and featureSet that are needed to create the featureCollection?

Any help is greatly appreciated.

Thank you.

William

0 Kudos
1 Solution

Accepted Solutions
RobertScheitlin__GISP
MVP Emeritus

William,

   You are doing a QueryTask that returns matching features (i.e. Graphics). So when you get the graphic why not add the REST operation results to that graphics attributes and then add that graphic to the graphics layer you create. That way the graphic has all the REST operations results as attributes and then your widgets result list and use the ObjectID of the graphic returned by the QueryTask to match to the ObjectID of the graphics in the map to allow you to zoom to the graphic.

View solution in original post

6 Replies
RobertScheitlin__GISP
MVP Emeritus

William,

   You are doing a QueryTask that returns matching features (i.e. Graphics). So when you get the graphic why not add the REST operation results to that graphics attributes and then add that graphic to the graphics layer you create. That way the graphic has all the REST operations results as attributes and then your widgets result list and use the ObjectID of the graphic returned by the QueryTask to match to the ObjectID of the graphics in the map to allow you to zoom to the graphic.

WilliamMiller4
Occasional Contributor II

Hi Robert,

I've created a graphics layer, added the REST results to graphics and added the graphics to the graphic layer. Would I use another QueryTask for the onClick event of the widget's list items to find the graphic by ObjectID?

William

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

William,

  No as you will just be looping through the GraphicsLayers graphics array and checking each graphic attributes for the matching ObjectID.

0 Kudos
WilliamMiller4
Occasional Contributor II

Hi Robert,
I'm having trouble getting an event to fire when I click my result list.

My Widget.HTML for the list is below.

<div data-dojo-type="widgets/RatioQuery/List" data-dojo-attach-point="list" data-dojo-attach-event="click:_selectResultItem" class="query-list">
  <!--some other divs displaying search criteria, and, when run, dynamically generated result divs-->
</div>

My Widget.JS for the click event is below.

_selectResultItem: function (){
  console.log("CLICKED!");
},

My List.JS for the click event is below.

_onClick: function(evt){
  console.log("EVT");
  console.info(evt);
},

Any idea why nothing is happening/logged?
Is this because the div with the data-dojo-attach-event can't be clicked directly, because it's covered by other divs?

Thank you.
William

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

William,

That all looks good to me. In the List.js do you attach a click event handler to the list container (lines 5 and 7)?

      startup: function() {
        this.items = [];
        this.selectedIndex = -1;
        this._selectedNode = null;
        this._listContainer = domConstruct.create("div");
        domClass.add(this._listContainer, "search-list-container");
        this.own(on(this._listContainer, "click", lang.hitch(this, this._onClick)));
        domConstruct.place(this._listContainer, this.domNode);
      },
WilliamMiller4
Occasional Contributor II

Hi Robert,

I had commented out line 7 a while back and had left it that way.

Thank you.

William

0 Kudos