Enhanced Locate Widget Version 2.16 - 08/21/2020

179075
218
10-02-2015 08:52 AM
Labels (1)

Enhanced Locate Widget Version 2.16 - 08/21/2020

Here is another widget for the Web App Builder.

Live Preview Site

Web AppBuilder for ArcGIS | Help - eLocate Widget

Features:

  • Locate and address (like the search widget, but gives you the ability to limit the address search to the maps current extent).
  • Locate coordinates using user defined spatial reference coordinates (i.e. DMS, State Plane, Etc).
  • Reverse Geocode capability called Address Inspection. Address Inspection is clicking on the map and getting the address of the map click point.

List of the latest enhancements and changes:

  1. Fixed issue with result tab being disabled and widget attempting to select the results tab.
  2. Fixed feature popups not working when the address inspector is activated and widget is closed.
  3. Add ability to specify a transform WKID.
  4. Added ability to specify the WKID that coordinates in the popup are displayed in.

Older Versions

Last 2.9 version

Last 2.7 version

Last 2.5 version

Last 2.4 version

Labels (1)
Attachments
Comments

Thank You very much Robert!

Hey Robert.  I've got an app that is configured with both eLocate and eSearch.  When using address inspector, if I have previously opened eSearch, clicking to get an address also returns an eSearch "By Shape" result.  For example, the red polygon in the following screenshot.

Ryan,

  I will look into disabling the eSearch graphical search when the widget is closed for a future release. But in the mean time you can workaround this issue by unchecking "Keep graphical search tool enabled after each draw" in the "Edit graphic search option".

Thanks Robert.  That would be great if you can figure something out.  No luck on the workaround, I already had that option unchecked.  Fortunately this is not a major issue.

Ryan,

 OK do you have it where both widget can be open at the same time?

Ryan,

   In the eLocate widgets Widget.js find the _reverseGeocodeToggle function and make this addition (add line 13):

      _reverseGeocodeToggle: function () {
        var node = this.revGeocodeBtn;
        if(domClass.contains(node, 'selected')){
          domClass.remove(node, "selected");
          this.drawToolBar.deactivate();
          this.drawActive = false;
          esriBundle.toolbars.draw.addPoint = this._defaultAddPointStr;
          this.enableWebMapPopup();
        } else {
          domClass.add(node, "selected");
          this.disableWebMapPopup();
          esriBundle.toolbars.draw.addPoint = this.nls.drawpointtooltip;
          this.publishData({message: "Deactivate_DrawTool"});
          this.drawToolBar.activate(Draw.POINT);
          this.drawActive = true;
        }
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

I have it configured with both widgets in the header controller (foldable theme), and they are not in a group together, so no, both widgets can't be open at the same time.  I added the line you shared in the previous post and no luck with that either, darn it.

Ryan,

   What versions are you using of both widgets and WAB?

So I'm running WAB version 2.1, eSearch 2.1.2, and eLocate 2.1.  

Ryan,

   OK this took a bit to track down but a widget is not actually closed as I thought when another widget is opened it is just deactivated thus my code for deactivating the drawbox was not getting called.

Make this addition to the eSearch Widget.js right before the onClose function:

      onDeActive: function() {
        this.drawBox.deactivate();
      },‍‍‍

and in the eLocate Widget.js add

      onDeActive: function() {
        this.drawToolBar.deactivate();
      },

right before onClose function.

I tried to fiddle around with this today, following your lead with the onDeActive function, but couldn't figure out what I was trying to do.  It's as if eSearch is listening for eLocate to create a search graphic, then fires off the search when address inspector adds a graphic.  I was trying to see if there was an event listener that I could possibly disable using the onDeActive function, but didn't get anywhere with that.

Ryan,

  Strange using the code above I solved the issue that you reported and I was able to reproduce on my end. So your saying you added the new function to each widget and it did not work for you?...

I did add the function to both, and double checked that I got drawBox vs drawToolBar correct and unfortunately it didn't work.  It's times like this it would be helpful to have my app on a public facing web server...    Very strange that your fix worked for you but not for me... I hope I described the issue accurately enough.  I just recorded a video so you can see what I'm seeing:

Ryan,

   I can not get your video to work. What theme are you using?

I'm using Foldable Theme.  Maybe the video would work on youtube (link).  If it doesn't work out to resolve this issue, I can use a workaround.  If I add a placeholder search layer that basically does nothing, and move it to the top of the search layers list, then the problem goes away.

Ryan,

   WOW, I fell like a real knucklehead. I had helped someone on GeoNet activate my eSearch with the located address and I accidently left that code in my production eLocate widget. To fix this issue just delete lines( 15 - 23) in the eLocate Widget.js:

      showLocation: function (locResult) {
        this._hideInfoWindow();
        this.graphicsLayer.clear();

        var ptGraphic = new Graphic(locResult.point);
        ptGraphic.setSymbol(locResult.sym);
        var Atts = {
          content: locResult.content,
          title: locResult.title,
          gid: parseInt(locResult.id.replace('id_', ''))
        };
        ptGraphic.attributes = Atts;
        this.graphicsLayer.add(ptGraphic);

        //Open point in eSearch
        var widgetCfg = this._getWidgetConfig('eSearch');
        if(widgetCfg){
           var eSearchWidget = this.wManager.getWidgetByLabel(widgetCfg.label);
           if(eSearchWidget) {
              this.wManager.openWidget(eSearchWidget);
              eSearchWidget.search(ptGraphic.geometry, 0);
            }
        }

Right on, that did it!  Of course, you are absolved of any and all knuckleheadery past, present, and future for all the work you share with this community.  A bonus of working through this issue is that one of my previous wishes has been granted:  the function you had me add earlier causes Inspector to be deactivated when eLocate is closed.  I like this change.  Thank you for your help, Robert!

Robert, I took this code from the _reverseGeocodeToggle function and put it in onDeActive, so the reverse geocode / Inspector button would also deactivate when the widget is closed.

      onDeActive: function(){
        var node = this.revGeocodeBtn;
        if(domClass.contains(node, 'selected')){
          domClass.remove(node, "selected");
          this.drawToolBar.deactivate();
          this.drawActive = false;
          esriBundle.toolbars.draw.addPoint = this._defaultAddPointStr;
          this.enableWebMapPopup();
        }
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Hi Robert,

Great widget. Really solved a problem for us in our custom viewer for internal staff. I was just wondering if there was any way to disable popups from appearing after a search? Specifically a coordinate search?

Thanks,

John

John,

   There is no configuration setting for this but you can edit the code in the Widget.js:

line 846 in the showLocation function needs to commented out:

             // this.showInfoWin(locResult);

and line 884 too.

Hi Robert,

Thank you very much for getting back to me so quickly! That worked perfectly! Really got me out of a hole.

Well done on all of your fantastic work in creating all of your Flex and WAB widgets. They're brilliant and a real help to those of us who haven't got the skills to do them ourselves. Very much appreciated!

Thanks once again,

John

Hi rscheitlin,

Please where do I increase the search radius for the AddressInspector within the js?, thank you for your response, most appreciated.

Baba

Hi Robert,

I have found it, sorry for the bugging.

Cheers

Baba‌

Hi Robert,

I've been testing eLocate in Portal 10.5.1 and it looks like it's almost working. In Widget.html on line 51, data-dojo-type="widgets/eLocate/List" is causing the widget to fail. Could you please change this to match how you solved the problem in eSearch? Thanks!!

For anyone else that sees this comment, I had to copy ServiceBrowserRule.js and serverBrowserRuleUtils.js from "<WAB Dev Edition>\client\stemapp\jimu.js" to "C:\Program Files\ArcGIS\Portal\apps\webappbuilder\stemapp\jimu.js" and "..Portal\apps\webappviewer\jimu.js\" to get this widget to work in Portal 10.5.1.

Alexandra,

   You will now find a older versions link in the main portion of this post and there it will have my updated 2.4 version with the fix. Some thing for the Identify widget too.

Anonymous User

Does the 2.4 version fix the issue so you do not have to copy the 2 .js files or do you still need to copy them from developer to portal?  The 2.4 version still seems to be locking up for us in portal 10.5.1, we haven't copied the .js files over.  Thank you.

Allison,

   You will still need to copy over the files. For some reason Portal shipped without all the same files as Dev has.

I received the following error when saving a WAB 2.4 app.  I was trying to use a custom icon for the widget:

Failed to save the app: ENOENT: no such file or directory, open 'C:\WebAppBuilderForArcGIS\server\apps\2\configs\eLocate\icon_Lat\Long Search.png'

Apparently the issue was trying to rename the Widget using a "/" character.  I tried to name it "Lat/Long Search".  But when I tried "Lat-Long Search" it worked.

Some of my users reported a small glitch where when they try to type latitude/longitude coordinates into the tool, nothing is entered.  I also noticed the map moving behind the widget box when it was open and they were typing.

I was not able to reproduce this issue using the same browser and operating system.  Just wanted to see if anyone else has had this issue?

Patrick,

   I have seen this before when using the number pad in some circumstances. I have never been able to track this down though as it is not a consistent issue.

Robert, great widget!

When I run the Inspector, how can I change the coordinate in the result from 102600 to 4326 so that it shows coordinates in degrees?

Giacomo,

   You would have to edit the createAddressInspectorResult function in the Widget.js. (lines 3, 4 added. line 11 changed):

      createAddressInspectorResult: function(addrCandidate) {
        var result = [];
        var lat = webMercatorUtils.webMercatorToGeographic(addrCandidate.location).y;
        var lon = webMercatorUtils.webMercatorToGeographic(addrCandidate.location).x;
        var sAdd = this.standardizeAddress(addrCandidate);
        var locateResult = {};
        locateResult.sym = this.rGeoMarkerSymbol;
        locateResult.title = addrCandidate.address.Address ? String(addrCandidate.address.Address) : addrCandidate.address.Street ? String(addrCandidate.address.Street) : this.manifest.name;
        locateResult.content = locateResult.rsltcontent = "<em>" + this.nls.address + "</em>: " +
          sAdd + "<br><em>" + this.nls.coordinates + "</em>: " +
          (lon).toFixed(2) + ", " + (lat).toFixed(2);
        locateResult.point = addrCandidate.location;
        locateResult.alt = false;
        locateResult.id = 'id_1';
        var projParams = new ProjectParameters();
        if (!locateResult.point.spatialReference && !isNaN(this.serviceWKID)){ // AGS 9.X returns locations w/o a SR and doesn't support outSR
          locateResult.point.setSpatialReference(new SpatialReference(this.serviceWKID));
          if (webMercatorUtils.canProject(locateResult.point, this.map)) {
            locateResult.point = webMercatorUtils.project(locateResult.point, this.map);
          }else{
            projParams.geometries = [locateResult.point];
            projParams.outSR = this.map.spatialReference;
            esriConfig.defaults.geometryService.project(projParams, lang.hitch(this, this.projectCompleteHandler,addrCandidate),
                                                        lang.hitch(this, this.geometryService_faultHandler));
          }
        }else if (locateResult.point.spatialReference){
          if (webMercatorUtils.canProject(locateResult.point, this.map)) {
            locateResult.point = webMercatorUtils.project(locateResult.point, this.map);
          }else{
            projParams.geometries = [locateResult.point];
            projParams.outSR = this.map.spatialReference;
            esriConfig.defaults.geometryService.project(projParams, lang.hitch(this, this.projectCompleteHandler,addrCandidate),
                                                        lang.hitch(this, this.geometryService_faultHandler));
          }
        }

        result.push(locateResult);
        return result;
      },‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

Thanks Robert I like this mod.  Something I've thought about a few times.

Just be sure to understand this mod will only work if your basemap is in Web Mercator.

Thanks Robert, worked like a charm.

Hi Robert,

I discovered that by default the geocoded XY coordinates are plotted on the street or on the access point to the property. Reading the documentation it seems that if you get DisplayX and DisplayY instead you will get the coordinates at rooftop level.

I have tried to modify the code without luck. Do you have any idea on how to do this? this is the documentation I found: Service output—ArcGIS REST API: World Geocoding Service | ArcGIS for Developers 

Thanks

Giacomo,

   The locate result point is coming from the createLocateResults function and 

locateResult.point = addrCandidate.location;

Which from the docs comes from the x and y properties:

The point coordinates of the output match location as specified by the x and y properties. 

If you wan to use the DisplayX and DisplayY then you have to create a point class using those values and assign them to the locateResult.point property.

Giacomo,

 I will add this in the 2.7 version of this widget.

Awesome, thank you

Hi rscheitlin‌, thanks for developing a great widget.  I am having one problem using it in a non-web mercator (NZTM) WAB web app hosted in Portal 10.6.  The coordinates tool works great, and the inspector tool works great, but the address tool isn't fully functioning.  It can search for an address and returns a result, but the click to zoom functionality does not work, and no marker is added to the map.  The zoom to and pan to functions from the Popup Panel widget likewise do not work with the located address.

Thanks,

Marc

Marc,

   Are you using a custom GeocodeServer service as well in your wkid?

Hi Robert, 

When I first posted the question I was using the default ESRI geocoder.  I have since deployed a geocoder service in NZTM.  I am still getting some weird results.  Now the widget returns an address, but the popup is in the wrong place and the map will not refresh on pan, only when I zoom in/out.  I can share the geocode service to you if that would help.

Cheers,

Marc

The black dot shows the correct location:

The black dot shows the correct address location.

Marc,

   Sharing the Geocode service is really the only thing that will help as this seems to be a projection or transformation issue.

The latest version work great thanks Robert!

Hi Robert is it possible to add an option to define a datum transformation TFWKID directly for coordinates?

Luke,

  I have never had anyone that has requested this. What is your need for this?

Ive got a project where we have a defined projection. Data is in a projected coordinate systems with data being transformed on the fly, data is reprojected into WGS84 to allow basemaps in WGS84 but there is a need to plot coordinates in the project coordiante systems with a specific transformation. Using the default, undefined transformation gives errors up to 200m without it being defined. This is a good example of what Im thinking. http://geodienste-umwelt.hessen.de/arcgis_js_api/sdk_37/samples/util_coordinate_converter/ 

Luke,

   Are you willing to do some testing in a WAB 2.9 app?

Absolutely

Version history
Revision #:
1 of 1
Last update:
‎10-02-2015 08:52 AM
Updated by: