Select to view content in your preferred language

Location Widget

27996
115
02-20-2015 07:50 AM
Labels (1)

Location Widget

Hey everybody,

I am trying to get my feet wet with creating custom widgets for the WebApp builder, so please be kind

A while back I had created a location widget for the Javascript API and figured it might be good to do a WebApp builder version.

It is still in development, but I figured it might be a good idea to share it and see what you think.

You can see a live version HERE.

Version 1.3 (3-13-15):

- This version should work with custom basemaps.

- Added Zoom level in settings. Depending on your basemap you might need to change zoom level to 0.01. Read here for details.

Version 1.2:

-Changed the Layout to Tabs (Robert Scheitlin, GISP‌  Thanks)

-Added UTM function

Tim

Labels (1)
Attachments
Comments
ThomasColson
MVP Frequent Contributor

This is just what I'v been looking for! (Sort of....). I'm by no means a java programmer, any tips or hints on how to configure this for other coordinate systems (e.g. UTM, State Plane, etc....). I've got this working in WAB DEV and it works right out of the box! Thanks!

ThomasColson
MVP Frequent Contributor

Tim an ice-bound cabin and lots of firewood a java programmer did make me. Love your widget, easy to customize, banging my head though trying to figure out how to replace the USNG with UTM coordinates. I'm thinking that using the ESRI Geocode -> Project service is the way to go, but way past my skill level.

TimWitt2
MVP Alum

Thomas, this is a great idea and can be added. It might take a while though.

TimWitt2
MVP Alum

Thomas Colson‌ as asked I have added a UTM function, let me know what you think

ThomasColson
MVP Frequent Contributor

This is absolutely brilliant! Works perfectly!

NicholasBarger
Frequent Contributor

Tim,

Very nice widget.  I found that it works perfectly in the WebMercatur projection (or whatever the default is for ESRI Maps).  However, I think I am asking a similar questions as Thomas.  I am unable to get this widget to work in another projection.  Our websites run in State Plane Feet.  I noticed that the conversion works correctly but the zoom to location does not.

I suppose I could get around this by reprojecting the service into Web Mercatur and everything would probably work fine.  I would rather not do that if I can avoid it.  Any other solutions as to how I can get this to work in SP?

Thanks,

Nick

NicholasBarger
Frequent Contributor

ok...so here is an update.  I actual do not have to reproject my services.  However, I must use an ESRI basemap when making the webmap in AGOL.  Then the tool works fine.  The same problem exists...how do I use this with State Plane Feet?

Nick

TimWitt2
MVP Alum

Nicholas Barger​ Can you share the AGOL basemap that you use, which causes issues? What method are you using when it zooms to the wrong location?

NicholasBarger
Frequent Contributor

Hi Tim,

Thanks for getting back to me.  I don't think that I can share the basemap... it actually isn't a basemap.  I added an imagery service from my server into the Web Map in AGOL as a basemap.  The projection of that service is in PA State Plane NAD 83 North Zone.

The conversion of the units works correctly.  My problem is that the tool does not zoom at all when using my local projection.  Everything works correctly using the Web Mercatur projection, or whatever the standard ESRI basemap uses.

Hopefully this info helps.  If you absolutely need a services / basemap in PA SP NAD83 North then I can see what I can do.

Thanks,

TimWitt2
MVP Alum

Can you give me the wkid?

I found a state plane basemap I can use.

NicholasBarger
Frequent Contributor

WKID 2271

~ Nick

TimWitt2
MVP Alum

Nicholas,

I am glad you pointed this out, it will take a bunch of code (mostly if statements)  but I should be able to make it possible to have a projected basemap. It might take some time though.

Tim

NicholasBarger
Frequent Contributor

No problems…thanks for the help. This is a very helpful tool.

~ Nick

MarkYerington
Frequent Contributor

xycode.png

I use the above to handle an xy entry.  It seems to work well, I just have a combo box that I select which coordinate system that I want State Plane or UTM is all we need locally.  If it is UTM I have to use the project to output to UTM from state plane since our basemaps are in State Plane already.  Don't know if this can be added to the location widget or not.  I just added this to my measure widget so it shows up under the measure results.

NicholasBarger
Frequent Contributor

Hi Mark,

I think the problem that I am having isn't that I cannot enter coordinates in SP... it's that the tool will not zoom to the location that I enter in either DD, DMS, or USNG.  The conversion works correctly.  I click on the button to the right and nothing happens.  When I change the base map to one that is in UTM projection it works correctly.

So, if I'm reading your post correctly, it seems that you have a combo box to define SP vs UTM.  Is that what would zoom to the coordinates?

TimWitt2
MVP Alum

Nicholas,

the reason why it is not zooming to your location is, because I use the following to zoom:

map.infoWindow.show(LocPoint, map.getInfoWindowAnchor(LocPoint));

map.centerAndZoom(LocPoint,15);

The issue is that the LocPoint is in a different wkid than your map frame. A stop gap would be to reproject the locpoint to fit your basemap wkid. Then the zoom should work.

Tim

MarkYerington
Frequent Contributor

Yeah as Tim said you could reproject that LocPoint prior to zooming and showing the info window.  Use the reprojectpoint function from above and change the wkid to the one that you mention above instead of 3418 like I have.

TimWitt2
MVP Alum

I should be done with a universal version no later than next week.

NicholasBarger
Frequent Contributor

Wow…that would be great. Thanks again!

~ Nick

TimWitt2
MVP Alum

At the moment I have everything working but the map click event. If you want to test what I have so far let me know.

NicholasBarger
Frequent Contributor

I can wait…thank you.

~ Nick

TimWitt2
MVP Alum

Well I guess next week is today. Please test the latest beta version I have just published.

NicholasBarger
Frequent Contributor

Ok…will do…thanks!

~ Nick

NicholasBarger
Frequent Contributor

Tim,

Looks like everything is working with a small exception. I found that I should not change the WKID in the UTM section. When I changed that things did not work well. When I left it as it is by default everything seems to work correctly, but when I click on the Get Location button it zooms me out… not in. So, the more I click on the button the further out I zoom. Where would I find the zoom level settings?

~ Nick

TimWitt2
MVP Alum

Can you give me a step by step what you do to cause that issue. I cant reproduce it.

NicholasBarger
Frequent Contributor

Ok… so I think I figured out the WKID section of the widget. It appears that I had some remnants of the previous version lingering in my test site. I started with a copy and things are now working correctly with the wkid.

However, I used ArcMap to give me coordinates for a location. I enter those coordinates into the widget. Everything converts correctly. I click on the get location button and it zooms me out to what appears to be the full extent of the globe. Pennsylvania is barely visible. If I click on the home button it has the location point in the correct spot, with the correct geocoded address.

Again, everything appears to be working correctly with the exception of the zoom level. Every time I click on the get location button it zooms out further.

~ Nick

TimWitt2
MVP Alum

Ahhh I ok.

I use the following to zoom:

map.centerAndZoom(LocPoint,15);

Depending on how your map is setup you might need to change the 15 to a 0.5.

It is explained here.

When using an ArcGISTiledMapServiceLayer, the map is zoomed to the level specified. When using aDynamicMapServiceLayer, the map is zoomed in or out by the specified factor. For example, use 0.5 to zoom in twice as far and 2.0 to zoom out twice as far.

NicholasBarger
Frequent Contributor

Yeah… I changed the LocPoint and the zoomPoint to match. I used 0.01 and 0.0075 also seems to zoom to a reasonable scale.

~ Nick

TimWitt2
MVP Alum

Nicholas Barger​ I have published the latest version. It lets you set the zoom level in the settings.

NicholasBarger
Frequent Contributor

Great… thanks! The one thing that I noticed was that when I changed the zoom level in the code it did it every time I zoomed. So, if I set those variables to 0.1 and I search for coordinates it would zoom into 1/10th of the current scale. Example… I would be at 400 mile scale and then after clicking on the get location button I would be at a 40 mile scale. I would type in another location while at the 40 mile scale and I would zoom into a 4 mile scale… and so on. I’ll let you know if the new version has the same behavior.

Thanks for all the work on this…it really is a helpful widget.

~ Nick

TimWitt2
MVP Alum

It will have the same issue, but I will be able to fix this quickly. Thanks for testing.

RebeccaStrauch__GISP
MVP Emeritus

Tim, suggestion....when updating you post with a new version, it is great that you are listing the changes, but it would also be helpful if you list the date you posted, by each version heading.​ that is:

      Version 1.3 (3/13/2015):

Tthat would make it easier for others to know whether they already downloaded or not. 

Thanks for your work on this widget.  I haven't been able to test yet, but look forward to trying next week sometime.

TimWitt2
MVP Alum

Thanks for reminding me. I did that for my advanced draw widget for the Javascript API and forgot to do it here.

NicholasBarger
Frequent Contributor

Hi Tim,

I noticed a small glitch in the widget.  It seems when I load my app for the first time and open the tool for the first time it does not return the correct coordinates when I click on the screen.  If I close the widget and reopen it everything works correctly.  This can be replicated by clearing the browser cache.  After clearing the cache and reloading the site the problem returns, but only for the very first time the tools is used.  After closing the widget and reopening it it works correctly regardless if you leave the site and return.

Here is a link to the site...

gissites.co.centre.pa.us/java/webia

It's not a terribly big deal....just thought you would want to know.

Thanks,

Nick

TimWitt2
MVP Alum

Thanks Nicholas, I'll look into it.

TimWitt2
MVP Alum

Nicholas,

it seems that Spatialutils.loadResource(); is not loaded in time. Can you try to move it infront of console.log('It is open, come on in!'); and see if it works then?

Tim

NicholasBarger
Frequent Contributor

No luck…same results. I updated the app that I sent you.

~ Nick

NicholasBarger
Frequent Contributor

Hi Tim,

I have a question.  Can you give me an idea of how to disable the popup function in your Location Widget?  I have an idea about the popups with this tool.  I'm looking for it now but I figured you had a better idea how to disable this.

The reason for this is I believe this widget is resizing my popup window permanently.  In other words, when I use the eSearch widget my popup window is the correct size.  I switch to the Location Widget click on the screen returning results in the popup window.  I then go back to the eSearch tool and the popup window is the same size as in the location window.

Since I really have no need for the popup I was looking to disable it.

Thanks,

Nick

NicholasBarger
Frequent Contributor

Hi Tim,

I found the code.  It appear that the info window resize was being set permanently.  I commented out all of the infoWindow calls and it worked.  I also commented out just the resize lines and then the popups worked and the eSearch popups were the correct size.

TimWitt2
MVP Alum

Nicholas,

if you don't want any infowindow, just delete every line that has infowindow in it. If it is just the resizing issue you can delete every line that has map.infoWindow.resize in it.

Tim

DavidBuehler
Frequent Contributor

This widget is great. I have a lot of potential uses for it, so thank you for sharing. I am not sure how hard it would be or if it is even possible as i am not a developer like a lot of you, but is it possible to return just the entered coordinates? By that I mean not snapping it to an address point, but letting the point be where the entered coordinates are?

TimWitt2
MVP Alum

David Buehler ,

You would like to turn of the automatic opening of the address window and just add a point at the exact coordinate?

If that is it, I will see what I can do.

Tim

DavidBuehler
Frequent Contributor

Hey Tim,

Thank you for responding.  I think yes? I think your widget operates on the premise that it is geocoding (correct me if I am wrong), unless it is to far away from an address.  I also think it is off of a road segment, right? 

I could see using it for, basically the "Go To XY" tool in desktop.  You punch in coordinates and that is what is returned, regardless of an address. Instead, listing the coordinates in the pop up would be great.

An example is a quick check for a crane on a property against an elevation data set, in my case a contour layer.  The Zoning Administrator would then make a quick determination if that crane is going to violate any height ordinances to issue a permit, and then print out a map with the returned XY.

David

TimWitt2
MVP Alum

David,

yes you are right, if an address is found (near your X/Y) it goes there instead and not exactly to the X/Y you fed it.

Attached find a quick example, which only works for Lat/Long. Let me know if this is what you had in mind.

Dropbox - Coordinate.zip

Tim

DavidBuehler
Frequent Contributor

Tim,

I am pretty new to the developer addition of web app builder so bear with me. If I download from the link you put up for the Coordinate widget, does that take the place of the Coordinate Widget that is already in place on the developer web app builder? I replaced the Coordinate Widget with yours after making a copy of the original.  See picture below:

CoordinateWidget.png

If so, how does one enter a coordinate? Or is it simply a click on screen and get a lat/long back? Or did I miss something? Do I need a certain projection?

Basically, I like your Location Widget. You can type your own coordinates in and it returns a result that you can zoom in on and see.

TimWitt2
MVP Alum

David,

that was my bad I posted the wrong link, this is the right one:

Dropbox - Location.zip

Place it here arcgis-web-appbuilder-1.1\client\stemapp\widgets  and then create a new app

Tim

DavidBuehler
Frequent Contributor

Tim,

So I placed the widget in the right spot, and created a new map.  I set it to my local conditions: WKID: 103471, zoom level.  I enter in either decimal degrees or degrees minutes seconds.   I have been working with Long 90°10'53.664"W, Lat 44°39'20.088"N or -90.181572, 44.655579. It should put it in the middle of an intersection.  It calculates the Lat/Long, but nothing shows up. Is that correct?  Am I doing something wrong?

David

TimWitt2
MVP Alum

David,

use the default WKID. When I type in your Lat/Long it takes me to an intersection in Marshfield.

Tim

DavidBuehler
Frequent Contributor

Ok, I figured it out.  My base maps that I was using were in a different projection, than WGS 1984 Web Mercator (auxiliary sphere). I switched over the base map and I see the point now.  Yes. This is exactly what I was thinking.

TimWitt2
MVP Alum

David,

check out this version, you will be able to use both Lat/Long buttons and click the map.

Dropbox - Location.zip

Tim

Version history
Last update:
‎02-20-2015 07:50 AM
Updated by:
Contributors