Select to view content in your preferred language

Adding a click handler on a Graphic with reactiveUtils

480
1
Jump to solution
08-16-2023 11:37 AM
ToddRunstein
Emerging Contributor

We're building out a tool (using version 4.25.5) that allows drawing shapes on a MapView (think boundry builder), and once constructed, we'd like to provide the ability to change the shape. So, we've drawn a Graphic with a Polygon and a SimpleFillSymbol to represent the boundry, and at each vertex, we overlay another Graphic with a Point and a SimpleMarkerSymbol. We expected to be able to add a listener onto the overlayed Graphic so we could be notified of hovers, clicks, and so on.

This example for reactiveUtils.on looked really promising!

reactiveUtils.on(
  () => view,
  "click",
  (event) => {
    console.log("Click event emitted: ", event);
  });

However, instead of the first argument returning view, we wanted to return a Graphic (or it's Geometry, or???). Perhaps it's just an issue with the typescript definitions, but we're getting complaints that the Graphic is not an "Evented" or "EventTarget", neither of which come up when searching the online docs.

In the interim, we're using a hitTest, as demonstrated in one of the samples, but attaching a listener on the individual Graphics is a preferred approach. Any suggestions on how to attach a listener onto a Graphic (or one of it's attributes) would be greatly appreciated!

0 Kudos
1 Solution

Accepted Solutions
ReneRubalcava
Honored Contributor

There are no click events on graphics due to the drawing engine. The hiTest sample you linked is the recommended way to "listen" for when you interact with graphics drawn on the map.

View solution in original post

0 Kudos
1 Reply
ReneRubalcava
Honored Contributor

There are no click events on graphics due to the drawing engine. The hiTest sample you linked is the recommended way to "listen" for when you interact with graphics drawn on the map.

0 Kudos