Graphics Layer Events Not Raised

[bbehling]

I have found a few Graphic Layer events not raised when used in an Angular app; Load ,Click, and Mouse Over.

I was told by an ESRI analyst that this is not supported in Angular.

Any idea on what I need to do to get at least the mouse events on a Graphics layer working in Angular?

[jwasilgeo]

This is possible using this repo and we have some docs pages that can shed some light on achieving this.

If you're using Esri JSAPI v3.x: https://arcgis.github.io/angular-esri-map-site-v1/#/patterns

If you're using Esri JSAPI v4.x: https://esri.github.io/angular-esri-map/#/patterns

We'll need more information to go on if the docs don't point you in the right direction. As per the new issue guidelines for this repo:

We can only provide useful help if we're able to reproduce the behavior you describe above. Please provide:

1. Steps to reproduce the behavior
2. A link to an app where we can carry out those steps (either our example pages, your publicly facing app, or a Plunker, JSFiddle, JSBin, etc)
3. Relevant code snippet(s) (only if not easily obtained from the above link)

We've created Plunkers that you can use as a starting point if the bug does not show in our example pages, or your app is not publicly accessible:

• Start here if using v1 (Esri JSAPI 3.x)
• Start here if using v2 (Esri JSAPI 4.x)

Be sure to save your edits and save and include the link to your live sample in this issue description.

[andygup]

@bbehling adding onto @jwasilgeo comments above, click events do work using ArcGIS JS API 4.x. What you are noticing is there are no mouse events on the 4.x GraphicsLayer Class. Reference - esri/layers/GraphicsLayer.

The events are available on SceneView and include things like click and pointer-move, but there's no mouse-over.

To capture click events in GraphicsLayer you'll need to roll your own custom click handler. You could even repurpose this code to work with pointer-move as long as the number of geometries in the layer didn't degrade mouse move performance. The basics of building it include adding the on-load event to the esri-scene-view element:

<esri-scene-view map="vm.map" on-load="vm.onViewLoaded" view-options="{scale: 50000000, center: [0, 0]}">

And in your controller code:

                    self.onViewLoaded = function(view){
                        console.log(view);
                        view.on("click",function(c){
                            console.log(c);
                        })
                    };

Here's an example app that prototypes one approach for determining if a graphic is near a click event: http://jsbin.com/tuqagop

[bbehling]

Sorry, I should have specified some more information....

I have an Angular app that is not using this repo, but using the ESRI JSAPI v3.x. In that app, we create our own Angular ESRI directives.

I contacted ESRI support about this issue and was given the information this isn't supported, so I wasn't sure where else to post this question (also posted on the geonet forum).

For a work around, I used the click event on the map. When I get some extra time, I will post a plunkr similar to what we are doing in our app.

Everything else in our custom ESRI directives is working perfectly, its just these Graphic Layer events seem to be an issue. I tested the graphic-add event, and that event is raised.

[jwasilgeo]

Hi @bbehling, hopefully things are all good now? I'll close because it has been awhile since we've had activity on this issue, but feel free to reopen if anything else related comes up. Thanks.