topic Re: Map click events and related WAB documentation in ArcGIS Web AppBuilder Questions

Map click events and related WAB documentation

HessCorporation — Sun, 12 Dec 2021 06:32:35 GMT

So i'm just kicking off my first WAB widget and immediately running into an issue trying to set map click handlers when the widget is opened. Looking through the esri coordinate widget i found this...

this.own(on(this.map, "click", lang.hitch(this, this.onMapClick)));

But I just can't get it to register the event, here's my full code...

define([
  'dojo/_base/declare', 
  'jimu/BaseWidget',
  'esri/geometry/Point',
  'esri/SpatialReference'
],
function(declare, BaseWidget) {
  //To create a widget, you need to derive from BaseWidget.
  return declare([BaseWidget], {
    // Custom widget code goes here 

      baseClass: 'jimu-widget-customwidget',


      startup: function() {
        this.inherited(arguments);
  //this.mapIdNode.innerHTML = 'map id:' + String(this.map.getScale());
      },
   
   onOpen: function(){
  this.own(on(this.map, "click", lang.hitch(this, this.onMapClick)));
      },
   
   onMapClick: function(event) {
  window.alert('map click');
     this.mapIdNode.innerHTML = 'map id:' + String(event.mapPoint.x);
       }
   });
});

I'm very confused why this isn't working.

Also does anyone know where i can find better documentation specific to the WAB? i also found this in the measurement widget and trying to work out the differences is giving me a headache, there seems to be a lot of methods/functions not found in the JSAPI and it would be nice to know what they are.

if (this.map && this.map.webMapResponse) {
          var handler = this.map.webMapResponse.clickEventHandle;
          if (handler) {
            handler.remove();
            this.map.webMapResponse.clickEventHandle = null;
          }
        }

Thanks all!

Richard

Re: Map click events and related WAB documentation

RichardThompson — Sun, 12 Dec 2021 06:32:37 GMT

Managed to answer my own question, code is below for future reference, the issue was that i wasn't defining dojo.lang.

define([
    'dojo/_base/declare',
    'dijit/_WidgetsInTemplateMixin',
    'jimu/BaseWidget',
    'dojo/_base/lang',
    'dojo/on',
  'dojo/dom',
  'dojo/domReady',
  'esri/tasks/query',
  'esri/tasks/QueryTask'
],
function(
    declare,
    _WidgetsInTemplateMixin,
    BaseWidget,
    lang,
    on,
  dom,
  domReady,
  Query,
  QueryTask
  ) {
  //To create a widget, you need to derive from BaseWidget.
  return declare([BaseWidget, _WidgetsInTemplateMixin], {
    // Custom widget code goes here 

      baseClass: 'jimu-widget-editor',
  name: 'Editor',

      startup: function() {
        this.inherited(arguments);
      },
   
  onOpen: function(){
  this.own(on(this.map, "click", lang.hitch(this, this.onMapClick)));
      },
   
  onMapClick: function(event) {
  this.mapIdNode.innerHTML = String(event.mapPoint.x);
  var queryTask = new QueryTask('*Service URL*');
  var query = new Query();
  query.returnGeometry = true;
  query.outFields = ['*'];

  query.geometry = event.mapPoint;
  queryTask.execute(query, lang.hitch(this, this.showResults));
  },

  showResults: function(results) {
  var resultItems = [];
  var resultCount = results.features.length;
  for (var i = 0; i < resultCount; i++) {
  var featureAttributes = results.features.attributes;
  this.featName.innerHTML = featureAttributes.NAME;
  //window.alert(featureAttributes.NAME);
  }
  }
   });
});

Re: Map click events and related WAB documentation

CarlosSousaFerreira — Wed, 07 Sep 2016 15:07:40 GMT

Thanks for this. It helped me too.

Re: Map click events and related WAB documentation

AndrewDavis5 — Fri, 01 Sep 2017 17:14:43 GMT

This helped me a good bit. Thanks for sharing.

Re: Map click events and related WAB documentation

TimDine — Fri, 03 May 2019 17:09:54 GMT

Additional link that may be useful. I found this page first, then the link below to show removing the event.

https://community.esri.com/thread/214607-how-to-turn-tool-for-mapclick-event-on-and-off