topic Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4 in ArcGIS JavaScript Maps SDK Questions

Equivalent of "Select Features" and "Map Graphics" in Javascript 4

SamuelAbati — Wed, 03 May 2017 18:22:34 GMT

I'm trying to migrate a webapp that was under development in the 3.7 API to use the 4.3 API

The base functionality of the app was that when the user would hold CTRL to click a point feature, it would make a SELECTION_ADD, selecting multiple features.

Also another functionality I can't find is changing the renderer/color of specific features, before I would go into the map graphics and change them directly (although I've found that wasn't the best way), now I'm not sure anymore

Everything gets even harder because I'm not working with FeatureLayer anymore, but instead a WebMap (which is a MapImageLayer)

In the end, my questions sum up to:

1) How to "select features" in a MapImageLayer/SubLayer, or any equivalent to getting the OBJECTID of a clicked feature.

2) How to change the renderer/color of specific features only, in this case would be the clicked features, but there is another case that is through a list of OBJECTIDs, (I believe this could be done by adding graphics on top of the features too, that would be no problem since my app is only for display purposes)

In 3.7 I used the layers events "click" and "selection-complete" to handle the logic, are these events no longer part of the flow of 4.X apps?

Any help as to where start or links to examples would be appreciated.

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

RobertScheitlin__GISP — Fri, 10 Dec 2021 21:22:17 GMT

Samuel,

1. In the 4.x API you use View.hitTest to get the graphic that is intersected by the user click:

https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html#hitTest

If your view click could intersect more than one geometry and you want all intersected geometries then you would do something like this:

view.on("click", function(event){
 var query = new Query();
 query.geometry = event.mapPoint;
 query.spatialRelationship = "intersects";
 lyrView.queryFeatures(query).then(function(results){
    //do something with the results
  });
});‍‍‍‍‍‍‍‍

2. You add a graphic to a GraphicsLayer or the maps graphics (GraphicsLayer) and set the graphics symbol to your desired selection symbol.

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

SamuelAbati — Wed, 03 May 2017 18:55:50 GMT

Thanks as always robert.

Just using hitTest (without your query example) it always outputs a empty result.

I was thinking maybe it is because its a MapImageLayer, so the query must be done?

Or maybe because all my features are point, and the screenPoint given to hitTest has no pixel tolerance

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

RobertScheitlin__GISP — Wed, 03 May 2017 18:59:18 GMT

Samuel,

Correct as there is no actual graphic to intersect when using a MapImageLayer (it's juts an image).

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

SamuelAbati — Wed, 03 May 2017 19:09:28 GMT

That explains a lot of things!

Last question, to your second answer, let's say I want to add a graphics on top of features of an MapImageLayer based on a list of OBJECTIDs

I would make a query filtering by those OBJECTIDs, return geometry, and then loop through the returned geometries to get their coordinates, so them I can add graphics to those coordinates.

Is that it or there is a simpler way?

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

RobertScheitlin__GISP — Wed, 03 May 2017 19:23:02 GMT

Samuel,

The return result of a query is a featureset (basically and array of graphics). So you just add those returned graphics to the GL no need to mess with geometries.

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

SamuelAbati — Wed, 03 May 2017 20:45:46 GMT

Do you happen to know how to add a pixel based buffer to the query/mapPoint?

My features are all points and the query using the mapPoint isn't finding anything

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

RobertScheitlin__GISP — Wed, 03 May 2017 21:07:18 GMT

Samuel,

I actually don't know how to do pixels but you can specify a distance and unit on the query class.

https://developers.arcgis.com/javascript/latest/api-reference/esri-tasks-support-Query.html#units

https://developers.arcgis.com/javascript/latest/api-reference/esri-tasks-support-Query.html#distance

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

JayHill — Thu, 09 Nov 2017 18:10:35 GMT

Where is lyrView defined?

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

RobertScheitlin__GISP — Thu, 09 Nov 2017 18:13:16 GMT

https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html#whenLayerView

You can get a layer view from the MapView

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

JayHill — Thu, 09 Nov 2017 18:42:52 GMT

Robert

I am getting lyrView.queryFeatures is not a function error.

app.view.whenLayerView(layer)
.then(function(lyrView) {

app.view.on("click", function(event){
console.log(event);
var query = new Query();
query.geometry = event.mapPoint;
query.spatialRelationship = "intersects";
lyrView.queryFeatures(query).then(function(results){
console.log(results);
   var graphic = new Graphic({
     //gotta set a defined geometry for the symbol to draw
     geometry: results,
     symbol: new SimpleMarkerSymbol({
        //color: [0,255,255],
        style: "circle",
        //size: "18px",
        outline: {
             color: [255,255,0],
             width: 3
        }
   })
})
});
app.view.graphics.add(graphic);
console.log(graphic);
})
});

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

RobertScheitlin__GISP — Thu, 09 Nov 2017 19:19:20 GMT

Jay,

What is your layer type?

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

JayHill — Thu, 09 Nov 2017 19:56:09 GMT

MapImageLayer

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

RobertScheitlin__GISP — Thu, 09 Nov 2017 20:07:19 GMT

Jay,

That is the reason. MapImageLayer view does not have a queryFeatures function.

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

JayHill — Thu, 09 Nov 2017 20:13:50 GMT

Ah ok. I thought this was a solution for using MapImageLayer

Thanks Robert

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

NathanielRindlaub — Thu, 24 May 2018 21:49:51 GMT

Jay, did you ever figure out a solution to this for MapImageLayer? I also would like to simulate a click on a mapImageLayer feature...

Re: Equivalent of "Select Features" and "Map Graphics" in Javascript 4

RobertScheitlin__GISP — Thu, 24 May 2018 22:07:52 GMT

For that you just add a view click event handler and execute an identifytask or a query task for certain layers in th MapImageLayer using the mapPoint as the geometry