topic Find Coordinates Tool for JavaScript Application in ArcGIS JavaScript Maps SDK Questions

Find Coordinates Tool for JavaScript Application

IanPeebles — Wed, 28 May 2014 14:49:06 GMT

Has anyone built a find coordinates tool for a JavaScript application? I have a python script built to do this for the Silverlight Viewer, but now I am interested in building a find coordinates tool for our JavaScript applications. Right now, I am using the 3.5 API legacy code, but plan to upgrade to 3.9 really soon.

The tool needs:

Input X:
Input Y:

as the parameters and I am hoping if possible to use a geometry service to locate the point on the map with a marker symbol and perhaps a label. The tool will also need to convert the coordinates from state plane coordinates to decimal degrees.

Are there any samples out there or does anyone have any ideas? Any feedback will greatly be appreciated. Thanks.

Re: Find Coordinates Tool for JavaScript Application

BjornSvensson — Wed, 28 May 2014 15:09:59 GMT

...coordinates tool ... Are there any samples out there or does anyone have any ideas?

You might find these samples useful:
https://developers.arcgis.com/javascript/jssamples/util_project.html
https://developers.arcgis.com/javascript/jssamples/util_coordinate_converter.html

Re: Find Coordinates Tool for JavaScript Application

IanPeebles — Wed, 28 May 2014 16:47:39 GMT

You might find these samples useful:
https://developers.arcgis.com/javascript/jssamples/util_project.html
https://developers.arcgis.com/javascript/jssamples/util_coordinate_converter.html

Thanks for the sample, however that is more of a point and click to get the coordinates. I need a window that allows the user to enter in the coordinates, then hit a button to execute. Something like the screenshot attached.

[ATTACH=CONFIG]34142[/ATTACH]

Re: Find Coordinates Tool for JavaScript Application

BjornSvensson — Wed, 28 May 2014 18:20:33 GMT

Ian, sounds like the second sample I listed is closer to what you are looking for. It allows users to type in coordinates, click a button, and then displays the projected coordinates.
https://developers.arcgis.com/javascript/jssamples/util_coordinate_converter.html

Re: Find Coordinates Tool for JavaScript Application

ScottGunn — Sun, 12 Dec 2021 04:12:33 GMT

Here's what I did...basically just took the value of two form fields (after validating the user's entry) and passed it to this function:

function zoomToPoint (x,y) {
  var point = webMercatorUtils.geographicToWebMercator(new Point(x, y, map.spatialReference));
  map.centerAndZoom(point,15);
  var tempPoint = map.graphics.add(new Graphic(point, config.gotoPoint));
  window.setTimeout(function(){map.graphics.remove(tempPoint);},3000);
  // on.once(map, "click", function(){
   // map.graphics.remove(tempPoint);
   // });
 }

It only allows for entering geographic coords (e.g. 35.1 -106.5) at the moment but I'm looking into allowing the user to enter UTM or decimal degrees in the future. The window.setTimeout function just draws a point at the coordinate and removes it after 3 seconds.

Hope that's helpful,
Scott

Re: Find Coordinates Tool for JavaScript Application

JeffJacobson — Sun, 12 Dec 2021 04:12:36 GMT

Here's a Gist showing how to convert from Degrees/Minutes/Seconds to decimal degrees.

Below is the same code (in case GitHub is down).

/*jslint browser: true, nomen: true */

/*jshint dojo, jquery, nomen:false */
/*global jQuery */
 
(function ($) {
    "use strict";
 
    // Matches DMS coordinates
    // http://regexpal.com/?flags=gim&regex=^(-%3F\d%2B(%3F%3A\.\d%2B)%3F)[°%3Ad]%3F\s%3F(%3F%3A(\d%2B(%3F%3A\.\d%2B)%3F)['�?�%3A]%3F\s%3F(%3F%3A(\d%2B(%3F%3A\.\d%2B)%3F)["�?�]%3F)%3F)%3F\s%3F([NSEW])%3F&input=40%3A26%3A46N%2C79%3A56%3A55W 40%3A26%3A46.302N 79%3A56%3A55.903W 40°26�?�47�?�N 79°58�?�36�?�W 40d 26�?� 47�?� N 79d 58�?� 36�?� W 40.446195N 79.948862W 40.446195%2C -79.948862 40° 26.7717%2C -79° 56.93172 
    var dmsRe = /^(-?\d+(?:\.\d+)?)[°:d]?\s?(?:(\d+(?:\.\d+)?)['�?�:]?\s?(?:(\d+(?:\.\d+)?)["�?�]?)?)?\s?([NSEW])?/i;
    // Results of match will be [full coords string, Degrees, minutes (if any), seconds (if any), hemisphere (if any)]
    // E.g., ["40:26:46.302N", "40", "26", "46.302", "N"]
    // E.g., ["40.446195N", "40.446195", undefined, undefined, "N"]
 
    /** Parses a Degrees Minutes Seconds string into a Decimal Degrees number.
    * @param {string}  dmsStr A string containing a coordinate in either DMS or DD format.
    * @return {Number} If dmsStr is a valid coordinate string, the value in decimal degrees will be returned.  Otherwise NaN will be returned.
    */
    function parseDms(dmsStr) {
        var output = NaN, dmsMatch, degrees, minutes, seconds, hemisphere;
        dmsMatch = dmsRe.exec(dmsStr);
        if (dmsMatch) {
            degrees = Number(dmsMatch[1]);
 
            minutes = typeof (dmsMatch[2]) !== "undefined" ? Number(dmsMatch[2]) / 60 : 0;
            seconds = typeof (dmsMatch[3]) !== "undefined" ? Number(dmsMatch[3]) / 3600 : 0;
            hemisphere = dmsMatch[4] || null;
            if (hemisphere !== null && /[SW]/i.test(hemisphere)) {
                degrees = Math.abs(degrees) * -1;
            }
            if (degrees < 0) {
                output = degrees - minutes - seconds;
            } else {
                output = degrees + minutes + seconds;
            }
        }
        return output;
    }
 
    // Add coordinate validation method to jQuery validator.
    if (typeof ($.validator) !== "undefined") {
        $.validator.addMethod("coordinate", function (value, element) {
            return this.optional(element) || dmsRe.test(value);
        }, "Please enter a Decimal Degree or DMS value.");
    }
 
    $.parseDms = parseDms;
}(jQuery));

Re: Find Coordinates Tool for JavaScript Application

nanasyazana — Wed, 08 Mar 2017 02:41:40 GMT

hi Ian,

have you found the solution? Same like me now, want to develop tool for find coordinate like yours.. Can you help me how to code it?

Thanks,

Regards,

Nana 😃

Re: Find Coordinates Tool for JavaScript Application

IanPeebles — Wed, 22 Mar 2017 15:30:37 GMT

Nana,

My apologies for the late response. I do have a sample I can send. Do you want me to send it by email or another method? There is still some minor modifications that need to be done, but I think it will get you started.

Re: Find Coordinates Tool for JavaScript Application

nanasyazana — Thu, 23 Mar 2017 01:07:45 GMT

Hi,

Thanks for your feedback.

U can send it by email.

Thanks ya 😃

Regards,Nana

Re: Find Coordinates Tool for JavaScript Application

IanPeebles — Fri, 24 Mar 2017 16:58:30 GMT

Nana,

Try the attachment that I posted. Host in on your c:\inetpub\wwwroot. Like I said, still a couple of modifications that I can make.

Re: Find Coordinates Tool for JavaScript Application

TimWitt2 — Fri, 24 Mar 2017 17:44:09 GMT

I created this some time ago: http://jsfiddle.net/timw1984/ahnmv8gy/embedded/result/

https://community.esri.com/people/timw1984/blog/2014/08/18/javascript-api-location-widget

Re: Find Coordinates Tool for JavaScript Application

TimWitt2 — Fri, 24 Mar 2017 17:59:13 GMT

In case you use the webappbuilder, I created this: ArcGIS Web Application

https://community.esri.com/docs/DOC-3262

Re: Find Coordinates Tool for JavaScript Application

BjornSvensson — Fri, 24 Mar 2017 20:52:12 GMT

For the WebApp Builder, there's also the Coordinate Conversion widget from the Solutions team that might be useful some people reading this geonet question. This widget converts input coordinates to various notation formats like MGRS for example. https://github.com/Esri/solutions-webappbuilder-widgets/tree/dev/CoordinateConversion

To play with it, go to http://esri.github.io/solutions-webappbuilder-widgets/ - "Coordinate Conversion" is the third widget.

Re: Find Coordinates Tool for JavaScript Application

TimWitt2 — Mon, 27 Mar 2017 14:13:22 GMT

Well thats better than my widget