Problems converting to Lat Lng with the xyToLngLat method

ErikEklund1 · ‎10-21-2013

Hi!
I'm a newbie to coordinates, so any help with my question is much appreciated. 🙂

I???m having trouble converting X Y coordinates (RT90) to lat and lng (I think it???s called WGS84?). I'm using an API that returns X and Y coordinates and I get quite strange results when calling the esri.geometry.xyToLngLat(long,lat) method.

For example when I pass X= 6570898 Y = 1630111 (a bit south of Stockholm, Sweden) the method should return lat: 59.239121, lng: 18,085032. But instead the esri.geometry.xyToLngLat method returns lat: 59.02738103790395 lng: 14.486671705724888.

Which is very very far west of Stockholm Sweden???..

As I said, I???m a newbie. What I???m I doing wrong? 🙂
Any help, much appreciated!

Kind regards
/Erik

KenBuja · ‎10-22-2013

The xyToLngLat method will only correctly convert input coordinates in Web Mercator to WGS84. To convert coordinates in any other projection, you'll have to use a Geometry Service.

Here's a modification of the Project a Point sample that uses the WKID 3021

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples 
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Project a point</title>

    <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/dojo/dijit/themes/claro/claro.css">
    <link rel="stylesheet" href="http://js.arcgis.com/3.7/js/esri/css/esri.css">
    <style>
      .esriPopup .contentPane span {
        display: inline-block;
        padding: 0 0 0.2em 0;
        width: 6em;
      }
    </style>

    <script src="http://js.arcgis.com/3.7/"></script>
    <script>
      var map, gsvc, pt;

      require([
        "esri/map", "esri/graphic", "esri/symbols/SimpleMarkerSymbol",
        "esri/tasks/GeometryService", "esri/tasks/ProjectParameters",
        "esri/SpatialReference", "esri/InfoTemplate", "dojo/dom", "dojo/on",
        "dojo/domReady!"
      ], function(
        Map, Graphic, SimpleMarkerSymbol,
        GeometryService, ProjectParameters,
        SpatialReference, InfoTemplate, dom, on
      ) {
        map = new Map("map", {
          basemap: "streets",
          center: [-98.445, 46.147],
          zoom: 3
        });

        gsvc = new GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
        map.on("click", projectToWebMercator);

        function projectToWebMercator(evt) {
          map.graphics.clear();
          
          var point = evt.mapPoint;
          var symbol = new SimpleMarkerSymbol().setStyle("diamond");
          var graphic = new Graphic(point, symbol);
          var outSR = new SpatialReference(102100);
          
          map.graphics.add(graphic);

          gsvc.project([ point ], outSR, function(projectedPoints) {
            pt = projectedPoints[0];
            graphic.setInfoTemplate(new InfoTemplate("Coordinates",
              "<span>X:</span>" + pt.x.toFixed() + "<br>" + 
              "<span>Y:</span>" + pt.y.toFixed() + "<br>" + 
              "<input type='button' value='Convert back to LatLong' id='convert'>" +
              "<div id='latlong'></div>"+ 
              "<input type='button' value='Convert to RT90' id='convertRT'>" +
              "<div id='rt90'></div>"));
            map.infoWindow.setTitle(graphic.getTitle());
            map.infoWindow.setContent(graphic.getContent())
            map.infoWindow.show(evt.screenPoint, map.getInfoWindowAnchor(evt.screenPoint));
            on.once(dom.byId("convert"), "click", projectToLatLong);
            on.once(dom.byId("convertRT"), "click", projectToRT90);
          });
        }

        function projectToLatLong() {
          var outSR = new SpatialReference(4326);
          var params = new ProjectParameters();
          params.geometries = [pt];
          params.outSR = outSR;
          
          gsvc.project(params, function(projectedPoints) {
            pt = projectedPoints[0];
            dom.byId("latlong").innerHTML = "<span>Latitude: </span> " + 
              pt.y.toFixed(3) + "<br><span>Longitude:</span>" + pt.x.toFixed(3);
          });
        }
        
         function projectToRT90() {
          var outSR = new SpatialReference(3021);
          var params = new ProjectParameters();
          params.geometries = [pt];
          params.outSR = outSR;
          
          gsvc.project(params, function(projectedPoints) {
            pt = projectedPoints[0];
            dom.byId("rt90").innerHTML = "<span>X: </span> " + 
              pt.y.toFixed(3) + "<br><span>Y:</span>" + pt.x.toFixed(3);
          });
        }
       
      });
    </script>

  </head>
  <body class="claro">
    <b>Click a location on the map to Project from LatLng -> Web Mercator:</b>
    <div id="map" style="width:600px; height:400px; border:1px solid #000;"></div>
  </body>
</html>

ErikEklund1 · ‎10-23-2013

Ken,
I really appreciate your help and effort!
I understand most of your answer but I'm kind of stuck on a big thing....

How would I pass my X Y coordinates to the function projectToWebMercator?

For instance a real simple example would be, how would I pass my previously mentioned X= 6570898 Y = 1630111 to the function?

Do I somehow push them into the mapPoint object? Sorry but I just cant figure it out.

But I'm really glad there is people like you who help.
Because one learns alot!

   function projectToWebMercator(evt) {
             var point = evt.mapPoint;

Best
Erik