Using the USNG - The Web
Now presenting part du of our USNG series - using USNG on our web site.
First, let’s review our minimum requirements for our USNG-supporting application:
- Locate and zoom to a USNG location (user input).
- Display USNG location on a mouse click and/or movement.
- Allow users to graphically display a USNG grid overlay on their screen.
Let’s start with the last one first, as it’s the easiest. If you recall in our ArcMap segment, we used some of ArcMap’s built in tools to render a USNG grid for us. We’re going one step easier with our web application - we’re going to use some pre-made grids from the fine folks at Delta State University. Simply head there and grab the area(s) you need. I would advise clipping your area of interest out, as the data sets are pretty large. It goes down to the 100k meter level, so it should do you fine. Add it to your web map with whatever software you’re using, set the scaling and labeling options as desired, and viola. Thanks Delta State!
First, grab that js file and include it in your page:
<script src=”usng.js” mce_src=”usng.js”></script>
First let’s look at taking our mylat and mylong coordinates and converting them to USNG.
myresults = LLtoUSNG(mylat, mylong, 3);
Here we’re making an alert box, but we could just as easily dropped the value into a tag somewhere. The last number is precision. It should be set to 1-5 and specifies the number of digits in the output coordinates. Remember we’re really talking grids with USNG, so 1 = 10km grid, 2 = 1km grid, all the way down to 5 = 1m grid.
That’s that. Put it in a function, and you can now produce USNG for your lat-long coordinates, whether they are from a mouse move, a mouse click, or from user input.
Next we’ll convert USNG input by the user to lat long. Remember we have to set the latlng return as an array before we get started.
alert(latlng + ‘ ‘ + latlng);
There you have it. Your USNG is converted to lat-long and an alert box pops up with the results.
Included in the zip file with the usng.js is a usng.htm example with a couple of functions. Nothing to write home about, but the basic functions you’ll need for your USNG-enabled web app.
If you want to see a really cool example of USNG and the Google Maps API, check out this site by Larry Moore. If you click on the information link at the top of the page, you can download the whole site and see how it works. But, in essence, it’s calling the USNGtoLL and LLtoUSNG functions we talked about above.
Powered by ScribeFire.