topic Re: How do I select a feature in a FeatureLayer? in ArcGIS JavaScript Maps SDK Questions

How do I select a feature in a FeatureLayer?

BoYan — Fri, 01 Jul 2016 21:54:08 GMT

I have rendered some features(client-side graphics) on a feature layer, how do I select individual features? Essentially I want to change the color or opacity to highlight the selected feature in the layer. The only thing I can do is to show the popup when I click on a feature, but how does the popup show up (how does it know which feature to show popup) under the hood?

Re: How do I select a feature in a FeatureLayer?

RobertScheitlin__GISP — Fri, 01 Jul 2016 22:25:18 GMT

Bo,

The FeatureLayer object has a select function that takes a query class. You can see the JS api doc for the specifics and the api samples for code.

Re: How do I select a feature in a FeatureLayer?

BoYan — Fri, 01 Jul 2016 22:49:32 GMT

thanks for the prompt reply, I found the function: FeatureLayer | API Reference | ArcGIS API for JavaScript 4.0

There are also some documentation about the query: Query | API Reference | ArcGIS API for JavaScript 4.0

But what I want to do essentially is that I can select a feature with mouse click. I'm actually using SceneView, so the features are 3d features.

I try to do the query based on geometry on mouse click event:

view.on("click", function(evt){

// evt is the event handle returned after the event fires.

console.log(evt.mapPoint);

var query = new Query();

query.geometry = evt.mapPoint;

lyr.queryFeatures(query).then(function(results){

console.log(results.features);

})

});

but it gives me the error:'name: "QueryEngine", message: "Invalid query", details: undefined'.

It looks like the query function only supports ArcGIS Online hosted feature service(s) or ArcGIS Server service(s)?

My features are rendered by client-side graphics.

Re: How do I select a feature in a FeatureLayer?

RobertScheitlin__GISP — Tue, 05 Jul 2016 13:18:50 GMT

Bo,

No you should be able to query client side features:

If working with a FeatureLayer created from a FeatureCollection (via source), only the geometry, objectIds, and spatialRelationship properties should be specified. Adding any other properties will return an error. If specifying a spatialRelationship, note that intersects is the only supported operation.

Re: How do I select a feature in a FeatureLayer?

BoYan1 — Tue, 05 Jul 2016 16:58:14 GMT

Robert,

I saw that and tried it, but it still gave me the error "Object {name: "QueryEngine", message: "Unsupported query", details: undefined}".

I'm not sure where I did wrong. Here's part I used to do the query:

view.then(function(){

console.log(lyr);

view.on("click", function(e){

console.log(e.mapPoint);

var queryParams = lyr.createQueryParameters();

queryParams.geometry = e.mapPoint;

queryParams.spatialRelationship = "intersects";

lyr.queryFeatures(queryParams).then(function(results){

console.log(results.features);

});

Re: How do I select a feature in a FeatureLayer?

BoYan1 — Tue, 05 Jul 2016 17:26:36 GMT

I'm using SceneView btw. But I tried with the sample code here: ArcGIS API for JavaScript Sandbox

I used this sample code to do the query, it gave me the same error "name: "QueryEngine", message: "Unsupported query", details: undefined" and after this error, there was another error "bundle.js:2559 Uncaught TypeError: Cannot read property 'domain' of undefined", I'm not sure if this is relavant.

Re: How do I select a feature in a FeatureLayer?

RobertScheitlin__GISP — Mon, 11 Jul 2016 13:47:55 GMT

Bo,

So it looks like there is an issue with querying FeatureCollections that needs to be reported to esri tech support.

Re: How do I select a feature in a FeatureLayer?

UndralBatsukh — Mon, 11 Jul 2016 23:15:56 GMT

Hi there,

You can use MapView.hitTest or SceneView.hitTest to search for graphics that intersect where you clicked on the view.

Here is a simple snippet how you can highlight a graphic on the view.

view.on("click", function(evt){

// Search for graphics at the clicked location

view.hitTest(evt.screenPoint).then(function(response) {

var result = response.results[0];

// console.log(result);

var symbol = new SimpleMarkerSymbol({

style: "circle",

size: 20,

color: "green",

outline: {

width: 1,

color: "neon",

style: "solid"

}

});

view.graphics.removeAll();

if (result) {

var selectionGraphic = result.graphic;

selectionGraphic.symbol = symbol;

view.graphics.add(selectionGraphic);

}

});

As for the FeatureLayer.QueryFeatures, it executes query against feature services. So you should not use against client side graphics. Please take a look at FeatureLayerView.QueryFeatures instead.

This looks like a question asked by you and Kristian answered that there is a known problem querying features in sceneview.

Hope this helps

Re: How do I select a feature in a FeatureLayer?

BoYan — Mon, 11 Jul 2016 23:29:48 GMT

Thanks for the reply. I eventually used hitTest() in SceneView | API Reference | ArcGIS API for JavaScript 4.0

for my purpose.

Just to add a comment, if I remove all the graphics from the view or layer and added the modified graphic, the "zoom to" function will raise an error (as described here: change the symbol (color, opacity, size, etc) when I click one feature in the layer ). I managed to fix it by cloning the graphics in the view/layer and modified them individually. Not sure if this is the correct way to do it since I manipulate the property values directly.