nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Widgets 4x: Listening for pointer events on a MapView

DirkVandervoort

I'm trying to figure out how to listen for pointer events on a MapView in my widget. I'm not getting very far... For example:

<SPAN class="token function">postInitialize</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
 watchUtils<SPAN class="punctuation token">.</SPAN><SPAN class="token function">on</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"view"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="string token">"pointer-down"</SPAN><SPAN class="punctuation token">,</SPAN> <SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">=</SPAN><SPAN class="operator token">></SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">_onPointerDown</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="punctuation token">}</SPAN>‍‍‍

will fire the _onPointerDown method when the MapView is clicked on. However, what I'm really interested in are the properties of the pointer-down event. e.g., x, y, etc. : MapView | API Reference | ArcGIS API for JavaScript 4.3

Any advice is appreciated - I'm just looking for an opening TIA

Encuentra más publicaciones etiquetadas con

Accepted answers

thejuskambi

You need to use the instance of MapView to add listener for the event like below.

mapView<SPAN class="punctuation token">.</SPAN><SPAN class="token function">on</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"pointer-down"</SPAN><SPAN class="punctuation token">,</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">=</SPAN><SPAN class="operator token">></SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">_onPointerDown</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN></SPAN>

All comments

Travis_L_Riffle

My "this" keyword is not available.... Am I the only one? Using AngularJS.

DirkVandervoort

Yep!

<SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN>view<SPAN class="punctuation token">.</SPAN><SPAN class="token function">on</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"pointer-down"</SPAN><SPAN class="punctuation token">,</SPAN><SPAN class="punctuation token">(</SPAN>evt<SPAN class="punctuation token">:</SPAN>PointerEvent<SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">=</SPAN><SPAN class="operator token">></SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">_onPointerDown</SPAN><SPAN class="punctuation token">(</SPAN>evt<SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN>
<SPAN class="line-numbers-rows"><SPAN>‍</SPAN></SPAN>

and

<SPAN class="keyword token">private</SPAN> <SPAN class="token function">_onPointerDown</SPAN><SPAN class="punctuation token">(</SPAN>evt<SPAN class="punctuation token">:</SPAN>PointerEvent<SPAN class="punctuation token">)</SPAN> <SPAN class="punctuation token">{</SPAN>
 <SPAN class="comment token">// do something with the evt</SPAN>
<SPAN class="punctuation token">}</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN><SPAN>‍</SPAN><SPAN>‍</SPAN></SPAN>

Brilliant!

thejuskambi

You need to use the instance of MapView to add listener for the event like below.

mapView<SPAN class="punctuation token">.</SPAN><SPAN class="token function">on</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="string token">"pointer-down"</SPAN><SPAN class="punctuation token">,</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN> <SPAN class="operator token">=</SPAN><SPAN class="operator token">></SPAN> <SPAN class="keyword token">this</SPAN><SPAN class="punctuation token">.</SPAN><SPAN class="token function">_onPointerDown</SPAN><SPAN class="punctuation token">(</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">)</SPAN><SPAN class="punctuation token">;</SPAN><SPAN class="line-numbers-rows"><SPAN>‍</SPAN></SPAN>

Únete a la Conversación

Los miembros registrados pueden publicar, seguir actualizaciones y más. ¿Nuevo aquí? Regístrate gratis.

Enlaces Rápidos

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.