Enhanced Locate Widget 1.9 - 8/4/22

8040
27
02-07-2022 01:13 PM

Enhanced Locate Widget 1.9 - 8/4/22

Note: This is an EB 1.9 Widget (not backward compatible).

 Live Preview Site

Changes in 1.9

  • Updated for EB 1.9

Older Changes in 1.7.1:

  • Auto Close Popup now works.
  • Added "Coordinate precision in popup results" setting that controls the number of digits to the right of the decimal for coordinates listed in the pop-up.
  • Setting the "WKID for coordinates displayed in popup" now controls the only displayed coordinates in the popup (no longer does it display the map WKID or the set WKID and Lat and Lon coordinates). If this value is not set then coordinates will be displayed as the maps WKID.
  • Fixed some widget settings getting entered in the config as strings instead of numbers as expected.

Features:

  • Locate an 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.

To install this widget extract the contents of the zip file to your EB\client\your-extensions\widgets. So once you extract the whole path would look like: \client\your-extensions\widgets\eLocate. Refresh your client and server windows (easiest way is to close both and 'npm start' them like you normally do to start EB). Now the draw widget will appear in your apps widget menu. Add the widget to your app. Now use the widgets settings panel to configure the widget.

Enjoy, Robert

Attachments
Comments
DavidDas__GISP
Frequent Contributor

 

Hi Robert,

 

Thanks a million for porting so many of your essential WAB Custom Widgets over to the EXB platform!

 

All your Custom Widgets for Experience Builder Version 1.7 are working flawlessly on our Parcel Map

 

  • Measurement Widget
  • Draw Widget
  • Print Widget
  • Enhanced Locate Widget
  • Feature Panel Widget

 

You would have to use Firefox to open this:

 

http://davidapps.net/exb/ParcelMapV6/

 

DavidDas__GISP_0-1645767778949.png

 

I had a simple enhancement request on the Popup for the Address Inspector Tool in your Enhanced Locate Widget.

 

The Popup shows both the Map Coordinates and the Lat/Long Coordinates.

The Map Coordinates are displaying Web Mercator (WGS84) meters:

X = -12478362 m

Y = 3954782 m

 

DavidDas__GISP_1-1645767778952.png

 

Can you add an option to display only the Lat/Long Coordinates like so:

 

DavidDas__GISP_2-1645767778955.png

 

This would make the Popup less cluttered.

 

I see there is an option to specify the WKID for the coordinates displayed in the Popup.

 

I have set it to 102100 = Web Mercator (WGS84) meter

 

DavidDas__GISP_3-1645767778968.png

 

Best regards,

 

David Das

 

JohnSasso2
Frequent Contributor

@RobertScheitlin__GISP @DavidDas__GISP  - I downloaded the Zip file, extracted, and copied the contents of such to:

\client\your-extensions\widgets\eLocate\

I did do the 'npm start' (ie. restart) of the client.  While I can add and configure the Enhanced Locate in EB, when in preview mode I click on the widget icon and see a blank dialog box:

JohnSasso2_0-1645804197570.png

 

 

Below is the configuration I have for it in EB:

 

JohnSasso2_1-1645804252284.png

 

RobertScheitlin__GISP
MVP Emeritus

@JohnSasso2 

Any errors in the browsers web console?

JohnSasso2
Frequent Contributor

@RobertScheitlin__GISP yes this one, which I circled in red, below, which is new following the add of the widget:

JohnSasso2_0-1645806688281.png

 

RobertScheitlin__GISP
MVP Emeritus

@JohnSasso2 

That is a warning. None of those warning or errors have anything to do with the eLocate widget. Have you tried shutting down EB and restarting?

JohnSasso2
Frequent Contributor

@RobertScheitlin__GISP yes I did, restart of both server and client.

To implement the widget, once I copy the contents of the zip file to \client\your-extensions\widgets\eLocate\, do I need to modify any of the files in there?

RobertScheitlin__GISP
MVP Emeritus

@JohnSasso2 

Nope. Just to check:

  1. you are using EB Developer 1.7 right?
  2. You have added the contents of the zip file (which is a folder named eLocate) directly under \client\your-extensions\widgets\? What I am asking is the is not "\client\your-extensions\widgets\eLocate\eLocate"
JohnSasso2
Frequent Contributor

@RobertScheitlin__GISP yes, using EB 1.7

Yes, here is what I see in File Explorer

JohnSasso2_0-1645812710018.png

 

RobertScheitlin__GISP
MVP Emeritus

@JohnSasso2 

I have never seen this before...

  1. Which app template are you using?
  2. Have you tried creating a new app?
RobertScheitlin__GISP
MVP Emeritus

@DavidDas__GISP 

New version available that addresses your enhancement request.

JohnSasso2
Frequent Contributor

@RobertScheitlin__GISP  sigh.  I feel like an idiot.  I had all 4 eLocate tabs disabled.  When configuring w/o looking closely, I thought I was enabling all four, since it seems this has been the way to enable things in other widgets.   It is now working.  Sorry my bad!

JohnSasso2_0-1645816101541.png

 

DavidDas__GISP
Frequent Contributor

Hi Robert,

 

Thanks so much for your superfast response!

 

I will test it out today.

RobertScheitlin__GISP
MVP Emeritus

@JohnSasso2 

Maybe I need to look at some warning that will be displayed if you disable all the tabs.

JohnSasso2
Frequent Contributor

@RobertScheitlin__GISP  also, your new widget is working fine.  I've been testing it out.  Thank you!

DavidDas__GISP
Frequent Contributor

 

Hi Robert,

 

I have tested your enhancement.

 

I tested these 6 cases setting different WKID values for the Coordinates displayed in the Popup.

 

Everything is working like a charm, except that the minimum precision defaults to 2.

You cannot change the minimum precision to 0

I don’t thing anyone would complain about this. In general, it is good to display at least 2 decimal places.

 

Here are the details of my testing.

 

Case 1: Default Precision Setting = 2 worked

 

WKID = 102100

Web Mercator (WGS84) Meters

Coordinate Precision = 2

 

DavidDas__GISP_0-1645825587118.png

 

DavidDas__GISP_1-1645825587133.png

 

Case 2: Precision setting = 0 did not work

 

WKID = 102100

Web Mercator (WGS84) Meters

Coordinate Precision = 0

 

DavidDas__GISP_2-1645825587143.png

 

DavidDas__GISP_3-1645825587146.png

 

Case 3: Precision setting = 4 worked

 

WKID = 102100

Web Mercator (WGS84) Meters

Coordinate Precision = 4

 

DavidDas__GISP_4-1645825587150.png

 

DavidDas__GISP_5-1645825587158.png

 

Case 4: Lat/Long, Precision = 6 worked

 

WKID = 4326

Decimal Degrees (WGS84)

Coordinate Precision = 6

 

DavidDas__GISP_6-1645825587163.png

 

DavidDas__GISP_7-1645825587170.png

 

Case 5: Lat/Long, Precision = 0 did not work

 

WKID = 4326

Decimal Degrees (WGS84)

Coordinate Precision = 0

 

DavidDas__GISP_8-1645825587174.png

 

It appears the minimum precision defaults to 2

 

DavidDas__GISP_9-1645825587181.png

 

Case 6: Stateplane Feet, Precision = 0 did not work

 

WKID = 2868

Stateplane AZ Central (NAD83-HARN) feet

Coordinate Precision = 0

 

DavidDas__GISP_10-1645825587196.png

 

The minimum precision defaults to 2 decimal places

 

DavidDas__GISP_11-1645825587203.png

 

Conclusion:

 

The Popup honors the WKID value that is set.

It can be Web Mercator (WGS84) meters, or Decimal Degrees (WGS84) or Stateplane feet.

Any precision value can be set so long the minimum precision is 2.

 

Best regards,

 

David Das

 

JohnSasso2
Frequent Contributor

@DavidDas__GISP @RobertScheitlin__GISP 

I would like to propose a feature addition to the Enhanced Locate widget.  I think I mentioned to one of you that it would be very helpful to have a widget where, when you pin an arbitrary point on the map, a pop-up box will show you the GPS coordinates and links to one or more maps which, if you click on their links, will bring you to another browser window for the map at that location.

For example, a link to Google Maps would bring you to Google Maps in a separate browser window at that location.  Similarly for Bing Maps, Caltopo, Open Street Maps, etc.   I thought the Enhanced Locate widget widget would be the best place to add this, but my TypeScript programming skills, esp in the EB environment, are practically nil.   As shown below, I hacked some of the code in widget.ts to include logic to show the custom links to the following maps crafted to go to the location:  Google Maps, Google Maps Street View, Google Earth, Bing Maps, Open Street Maps, and Caltopo.

JohnSasso2_0-1646321004378.png

Thus, when I use Inspector to pin-point a particular location on the map, the pop-up box presents to me links to the various aforementioned maps.  Click on a link (e.g. "location link" for Google Maps), and another browser window to that map at that location will come up.

As I said, my coding skills in TypeScript and EB are to where its not possible for me to add such a feature at this time or even in the near term.   I would be happy to share the code with you to examine.  Yes, I admit what I did was a kludge and the interface could be much nicer.

MicahWilliamson
Frequent Contributor

@RobertScheitlin__GISP Using EXB 1.9 this Widget just spins. 

MicahWilliamson_0-1659546141346.png

Am I missing something? 

Also When I do get it to work Does this Locate widget search features or just addresses? 

Can we use a URL Parameter to activate it? 

RobertScheitlin__GISP
MVP Emeritus

@MicahWilliamson I have yet to test EB Dev 1.9. There could be some breaking changes. What error is in your browsers web console?

This widget searches addresses, locates user entered coordinates, and returns addresses based on user clicking on the map.

Currently there are no URL parameter capabilities.

RobertScheitlin__GISP
MVP Emeritus

@MicahWilliamson I have now updated the widget for 1.9's breaking changes.

JacobJackson_09
Occasional Explorer

This has been a very helpful widget, thank you! 
Minor coding flaw I found: the address locator "no results found" message is never displayed due to the else statement setState command in Line 406 of Widget.tsx not opening the results tab with a selTab: 'resultslabel' setting. 

Adjusted line:  this.setState({showProgress: false, locating: false, selTab: 'resultslabel'})

 

 

JohnKennedyTailteEireann
New Contributor

Hi @RobertScheitlin__GISP,

This is a great app and one I've used many times in WAB. Thanks for creating it. I'm just wondering if it will work in EB in ArcGIS Portal 1.9.1? Or will it only work in the Dev edition of EB?

JeffreyThompson2
MVP Regular Contributor

@JohnKennedyTailteEireann The ability to add custom Experience Builder widgets to an Enterprise portal was added with Enterprise 11.0. You will need to use Developer Edition.

AValenski
Occasional Contributor

@RobertScheitlin__GISP Hey Robert! Is this widget forward compatible with ExB 1.13? There have been several breaking changes in the last couple of releases and I was unsure if it has been tested for use in the current build?

johndixonldeq
Occasional Explorer

I am running ExB Dev 1.14 and when I added this widget it keeps giving me "Cannot read properties of undefined (reading 'addEventListener')"  I am new to this, therefore I am inexperienced.  Any suggestions or fixes would be greatly appreciated.

bdoventures
Occasional Contributor

@johndixonldeq, a lot of changes were made in 1.14 that appear to be breaking widgets written for previous versions.  Unfortunately, Robert's not around anymore, and it doesn't look like anyone is willing to fill his large shoes yet in terms of widget development for the masses.

tlomas_bouldercounty
Occasional Contributor

@johndixonldeq @bdoventures It works for me in ExB Dev Edition 1.15. I didn't need to make any code changes to get it to work.

KearaMcKay1
Emerging Contributor

Having an issue with the eLocate, getting a 404 error when trying to configure in Experience Builder, any tips? 

It appears in my custom widget list, but just spins and the console provides the errors below

KearaMcKay1_1-1729839909929.png

KearaMcKay1_2-1729839975780.png

 

 

 

 

Version history
Last update:
‎08-04-2022 11:31 AM
Updated by: