Graphic marker query

ITApplications

Hi all

I'm hoping this is a simple query. On my map a customer is restricted to dropping a simple marker on our streets feature layer only. This stops customers dropping markers in fields or any other area when reporting an issue with a street. This happens via a hitTest event on the graphics (see sample below).

 

view.on("click", function (evt) {
          var graphic = new Graphic({
            geometry: {
              type: "point",
              x: evt.mapPoint.x,
              y: evt.mapPoint.y,
              spatialReference: view.spatialReference,
            },
            symbol: {
              type: "simple-marker",
              color: [255, 10, 10],
            outline: {
              color: [255, 255, 255],
              width: 2,
              },
            },
          });
        
        view.hitTest(evt).then(({results}) => {
          if (results.length) {
            view.graphics.removeAll();
            view.graphics.add(graphic);
          }
        });
       });

 

This currently works brilliantly.

However if I add another feature layer to the map (in this case our county boundary layer), the restrict to hitTest part of the query for the graphics marker is ignored and it lets a customer drop a marker anywhere of their choosing.

 

Why is it doing this and what can I do to mitigate it? The hitTest is only linked to the streets layer and that part still works fine when a street in interacted with, it's just the graphics query which seems to be ignored now. 

I've got my roads feature layer to load as 0 and the boundary layer as 1.

Thanks

JoelBennett

The call to hitTest as you have it will query every single layer in the view, and the graphic will be added to the map if any feature from any layer in the view intersects the hit point.  Here, I'm assuming your county boundaries layer is a polygon, and so the hitTest is intersecting that polygon.  Therefore, since the hitTest intersects a feature, your graphic is placed on the map.

You need to tell the hitTest method to only query against your streets layer, and that can be done in the second argument (called "options" in the documentation) to hitTest.  For example (assuming you have a reference to your layer with a variable named "streetsLayer"):

 

view.hitTest(evt, {include:streetsLayer}).then(({results}) => {
	if (results.length) {
		view.graphics.removeAll();
		view.graphics.add(graphic);
	}
});