topic Re: view.hitTest returning 0 results in ArcGIS JavaScript Maps SDK Questions

view.hitTest returning 0 results

JasonRainwater — Wed, 25 Jan 2017 18:30:38 GMT

Hi, I am adding am empty feature layer on the fly in the browser. After the fact I will add graphics to the source collection of the feature layer and my graphics all render correctly.

I setup the mapView.on("click") and I properly get the event with the click data. I do the hit test then look at the results.

I am physically clicking directly on the rendered graphic but no matter what the hittest shows 0 results.

I have no idea where to start looking to see what I am doing wrong. Any ideas?

Re: view.hitTest returning 0 results

KellyHutchins — Thu, 26 Jan 2017 18:22:04 GMT

Are you able to reproduce the problem with this sample from the help?

ArcGIS API for JavaScript Sandbox

Is the problem specific to one particular browser? There is a known issue with version 4.2 and IE11 that will be fixed in the next release of the JSAPI. Details here:

https://community.esri.com/thread/188819-jsapi-v4-access-features-with-click-events-not-working-in-ie11

Re: view.hitTest returning 0 results

JasonRainwater — Thu, 26 Jan 2017 18:37:52 GMT

No this is in chrome. Also when will that next version be released? I'm currently testing in chrome with no results but ie11 is our main supported browser.

Re: view.hitTest returning 0 results

KellyHutchins — Thu, 26 Jan 2017 18:40:05 GMT

Can you reproduce in Chrome with the sample I linked to above? Works just fine for me in the latest version of Chrome.

Re: view.hitTest returning 0 results

JasonRainwater — Fri, 27 Jan 2017 12:32:30 GMT

Yes that works but I'm not pointing the feature layer to a url that hosts a server based feature layer. I am creating an empty feature layer and then in javascript creating graphics objects with symbols and then adding them to the source collection of the feature layer. Is there a sample that mimics that scenario?

Re: view.hitTest returning 0 results

JasonRainwater — Fri, 27 Jan 2017 13:01:19 GMT

I tried modifying code in several examples that use simplemarkersymbol and adding features as a collection of graphics but I could not find a sample that more closely matches my current situation. I am creating an empty feature layer like so

var featureLayer = new FeatureLayer({
fields: [
{
name: "ObjectID",
alias: "ObjectID",
type: "oid"
}
],
id: "CustomPointLayer",
objectIdField: "ObjectID",
geometryType: "point",
spatialReference: spatialReference,
source: sourceCollection
});

this.customPointLayer = featureLayer;
this.customPointLayer.then(() => {

defer.resolve();
});

localMap.add(this.customPointLayer);

And then im adding a graphic like so

var circleProperties: __esri.SimpleMarkerSymbolProperties = {
size: 40,
color: new Color("red"),
outline: {
color: new Color([255, 255, 255]),
width: 0
}
};

var circleSymbol = new SimpleMarkerSymbol(circleProperties);

var circleGraphic = new Graphic();
circleGraphic.geometry = point;
circleGraphic.symbol = circleSymbol;
circleGraphic.attributes = {
ObjectID: this.guidService.newGuid(),
recordsIds: clusterSymbolType.recordIds
}
customPointLayer.source.add(circleGraphic);

I then add a textsymbol on top of it like so

var countProperties: __esri.TextSymbolProperties = {
color: new Color("white"),
yoffset: -5,
text: count.toString(),
font: { // autocast as esri/symbols/Font
size: "20px",
family: "roboto",
weight: "400"
}
};

var countSymbol = new TextSymbol(countProperties);

var countGraphic = new Graphic();
countGraphic.geometry = point;
countGraphic.symbol = countSymbol;
countGraphic.attributes = {
ObjectID: this.guidService.newGuid(),
recordsIds: clusterSymbolType.recordIds
};

customPointLayer.source.add(countGraphic);

im then listening like so

this.mapView.then(() => {
this.mapView.on("click",
(p) => {
this.mapView.hitTest(p.screenPoint)
.then(response => {
// do something with the result graphic
var graphic = response.results[0].graphic;
});

});
this.mapViewDefer.resolve();
});

However no matter which browser the hitTest returns 0 length for the results property

Re: view.hitTest returning 0 results

JasonRainwater — Fri, 27 Jan 2017 13:15:02 GMT

i think i figured something out. If i go to this link https://developers.arcgis.com/javascript/latest/sample-code/sandbox/index.html?sample=visualization-location-simple

and add this code at line 122

view.then(function(){
view.on("click", function(p){
alert(p.screenPoint.x);
view.hitTest(p.screenPoint).then( function(response){
alert(response.results.length);
});
});
});

and then i change the style to include a margin-top

#viewDiv {
padding: 0;
margin-top: 100px;
height: 100%;
width: 100%;
}

It stops working. i can click on just a green area and get 0, if i click directly on an orange dot i get 1. If i do nothing but remove the margin-top and set it back to margin: 0; then if i click in any of the green area i get 1, if i click in the gray area i get 0 and clicking on any orange dot i get 2. This is what i expect. It looks like the hittest doesnt work if the map is not taking up the entire area?

Re: view.hitTest returning 0 results

JasonRainwater — Fri, 27 Jan 2017 15:45:39 GMT

I got something working but i have a feeling the code will break with the next upgrade if it fixes the problem. I get my graphics properly when i do this

_this.mapView.on("click", function (p) {
var boundingRect = _this.mapElement[0].getBoundingClientRect();
var point = {
x: p.screenPoint.x + boundingRect.left,
y: p.screenPoint.y + boundingRect.top
};
_this.mapView.hitTest(point)
.then(function (response) {
// do something with the result graphic
var graphic = response.results[0].graphic;
});
});

Re: view.hitTest returning 0 results

JasonRainwater — Mon, 30 Jan 2017 17:33:29 GMT

Hi kelly, is there any update on when a version will be available on the ie11 fix? We can work around the all browsers issue with what i have below but ie is critical for us

Re: view.hitTest returning 0 results

KellyHutchins — Mon, 30 Jan 2017 18:21:07 GMT

Jason I'm not sure that the issue is the same one you are experiencing - you may want to contact Esri support to setup a test case. The other issue will be fixed in the next release which is scheduled for the March time frame.

Re: view.hitTest returning 0 results

JasonRainwater — Tue, 31 Jan 2017 12:27:03 GMT

Thats fine, i have a workaround for the issue in this item. Ill open up a test case for it.

Re: view.hitTest returning 0 results

chuckfrank — Tue, 31 Jan 2017 17:10:52 GMT

Jason,

I was trying to do the same thing a couple of weeks ago and after several attempts, stopped trying to use a feature layer and instead just used graphics. Like you, I was not using a service, I could see the graphics, but could not click on them. I also tried a hit test and got an empty result. I started to suspect a problem with the mouse click needing to be extremely precise. I never figured out the cause of the problem but would be interested to know how your case ends up. Here is the thread for my issue: PopupTemplate from Client Side Graphics Not Working

Thanks,
Chuck

Re: view.hitTest returning 0 results

JasonRainwater — Tue, 31 Jan 2017 17:43:21 GMT

Hey Chuck, if you look at one of my later responses above you can see what i had to do in order to make it work. apparently hitTest only works if the map is taking up the entire screen. I had to adjust the point it hittest against relative to the distance from the top and left of the map element and it started working. Still doesnt work in ie11 or edge but at least we know now there is an all browser bug against how the hittest is calculated.

Re: view.hitTest returning 0 results

JasonRainwater — Tue, 31 Jan 2017 18:06:01 GMT

I looked at the link you provide. What seems like would cause it to stop working is if you set something like a margin-top 50px. I am pretty sure your working example would stop working if you do that. It only works because you have margin 0 and height/width 100%

Re: view.hitTest returning 0 results

DavidColey — Tue, 31 Jan 2017 20:26:58 GMT

Jason, if you check this post you can see a couple examples of how we're returning a selction grahic and poup results from our feature layes using the hitTest method:

https://community.esri.com/thread/183372-jsapi-40-popup-set-highlight-graphic-on-feature-layer-click

Re: view.hitTest returning 0 results

JasonRainwater — Tue, 31 Jan 2017 20:33:21 GMT

Hi David, if you look at what I've posted above you'll see that hittest only works if the map takes up the full window. I would bet that if you took your working code and added a margin-top 50px on the div hosting the map your hittest will stop working. Above I was able to demonstrate this by slightly modifying the code so that the map div did not take up the full screen (in the samples case it's an i frame and the sample takes up full size of the iframe

Re: view.hitTest returning 0 results

DavidColey — Tue, 31 Jan 2017 21:46:04 GMT

Hi Jason, ok I now see your issue and how you are having to account for that offset. I am using the calcite map bootstrap 4.x template for all of our api apps and so am not adding any margin or padding. Of course, the real fix for this lies with ESRI and upgrading the popup's widget code to handle selection graphics and paging . . .

Re: view.hitTest returning 0 results

OliverTylšar — Sat, 11 Dec 2021 19:50:23 GMT

I was facing similiar problem. I used the code from the example and it didn't work. The problem was that when view.on("click", function(evt){...}) was fired, it was trying to store properties x and y of object env into variable screenPoint. But there were no properties like this, so the x, y in screenPoint was 'undefined'. But object env has a whole property screenPoint, which already holds the x, y values.

So if you keep getting returned empty results, try to check if the properties are in the object. If not, then you can easily replace this:

var screenPoint = {
    x: evt.x,
    y: evt.y
};

with this:

var screenPoint = evt.screenPoint;

Re: view.hitTest returning 0 results

JohnGrayson — Sat, 11 Dec 2021 19:50:26 GMT

Another common issue happens when the view container is not 100% of the width and height of the body node. In these cases I normally adjust the event screenPoint by the view position:

evt.screenPoint.x += view.position[0];
evt.screenPoint.y += view.position[1];‍‍

Re: view.hitTest returning 0 results

KevinCheriyan — Mon, 04 May 2020 13:50:17 GMT

Looks like this is still an issue with ArcGIS API for JavaScript 4.15. Still can't return results with hitTest on client-side graphics in a Feature Layer, or view popups.