Show x,y Coordinates in UTM

[LauraMiles1]

It seems this isn't possible using webMercatorUtils.project(), I'm just wondering if anyone has found a way to successfully convert a point to UTM? I'm trying to have the mouse coordinates show in UTM (NAD 83 Zone 10), but the following doesn't pass webMercatorUtils.canProject():

var utmSR = new SpatialReference(102410);

var Point = webMercatorUtils.webMercatorToGeographic(evt.mapPoint);

        if (webMercatorUtils.canProject(utmPoint, utmSR)) {

            var utmPoint = webMercatorUtils.project(Point, utmSR);

            console.log(utmPoint.x.toFixed(3) + ", " + utmPoint.y.toFixed(3));

        }

The API reference doesn't say anything about why something might not pass canProject()

A jsfiddle here​

[RobertScheitlin__GISP]

Laura,

The WebMercatorUtils are only for converting webmercator to geographic and vice versa.

esri/geometry/webMercatorUtils | API Reference | ArcGIS API for JavaScript 3.17

Convert Web Mercator coordinates to geographic and vice versa.

[LauraMiles1]

Ah, thanks - my oversight!

[SteveCole]

This might be of some use to you. I'm using the USNG library to display USNG values for the cursor's current location in one of my apps. There's some reference to it also supporting UTM so you might be able to use it for your current issue.

[LauraMiles1]

Steve, that's very helpful thank you - we're looking to add MGRS conversion eventually as well.

[SteveCole]

No problem! Conversion to UTM will be a little awkward but should be (relatively) easy. It looks like you need to go Lat/Long->MGRS->UTM.

FWIW, here's my code using that library:

        map.on("mouse-move", showCoordinates);
        map.on("mouse-drag", showCoordinates);

        function showCoordinates(evt) {
          //the map is in web mercator but display coordinates in geographic (lat, long)
          var mp = webMercatorUtils.webMercatorToGeographic(evt.mapPoint);


          u = new USNG2();
          var theLatLong = [];
          theLatLong["lon"] = mp.x;
          theLatLong["lat"] = mp.y;
          var theUSNG = u.fromLonLat(theLatLong,5).toString();
            
          //display mouse coordinates
          dom.byId("lblCurCoords").innerHTML = "<span style=\"font-weight:bold;\">Lat/Long:</span> " + mp.y.toFixed(4) + ", " + mp.x.toFixed(4) + "<br/>" + "<span style=\"font-weight:bold;\">USNG:</span> " + theUSNG;
          
        }

[MauricioAbreu]

Hi everyone, 

I need to display the coordinates in UTM on a map like this: Intro to popups | ArcGIS API for JavaScript 4.10 

Here is the code:

view.popup.autoOpenEnabled = false;
view.on("click", function(event) {

// Get the coordinates of the click on the view
var lat = Math.round(event.mapPoint.latitude * 1000) / 1000;
var lon = Math.round(event.mapPoint.longitude * 1000) / 1000;

view.popup.open({
// Set the popup's title to the coordinates of the location
title: "Reverse geocode: [" + lon + ", " + lat + "]",
location: event.mapPoint // Set the location of the popup to the clicked location
});

// Display the popup
// Execute a reverse geocode using the clicked location
locatorTask.locationToAddress(event.mapPoint).then(function(
response) {
// If an address is successfully found, show it in the popup's content
view.popup.content = response.address;
}).catch(function(error) {
// If the promise fails and no result is found, show a generic message
view.popup.content =
"No address was found for this location";
});
});
});
</script>

Can anyone help me with that? Thank you.

[UndralBatsukh]

In 3.x, you can use coordinateFormatter. This sample shows how it can be used.

In 4.x, you can use CoordinateConversion widget.