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

[SamuelAbati]

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.

[RobertScheitlin__GISP · Accepted solution]

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.

[SamuelAbati]

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

[RobertScheitlin__GISP]

Samuel,

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

[SamuelAbati]

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?

[RobertScheitlin__GISP]

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.

[SamuelAbati]

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

[RobertScheitlin__GISP]

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 

[JayHill]

Where is lyrView defined?

[RobertScheitlin__GISP]

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

You can get a layer view from the MapView