Project geolocation coords to State Plane

[RobertMartin2]

Hi all,

I have a State Plane-based map to which I'd like to add a point (WGS84) for the user's location. This is my code:

if (navigator.geolocation) {  navigator.geolocation.getCurrentPosition(function(location) {   gpsPoint.setLatitude(location.coords.latitude);   gpsPoint.setLongitude(location.coords.longitude);      gpsGraphic.setGeometry(gpsPoint);   gpsGraphic.setSymbol(gpsSymbol);    map.graphics.add(gpsGraphic);   map.centerAndZoom(gpsPoint, 12);    gpsIsOn = true;   }); }

So far I'm getting the error:

Map: Geometry (wkid: 4326) cannot be converted to spatial reference of the map (wkid: 2229)


Specifically it's the centerAndZoom call that is throwing the error. I found this post which suggested using a geometry service to reproject the point:

// Project gpsPoint to State Plane var projectParams = new esri.tasks.ProjectParameters(); projectParams.geometries = [gpsPoint]; projectParams.outSR = map.spatialReference;  var defer = geometryService.project(projectParams); dojo.when(  defer,  function(projectedGeometry) {   if (projectedGeometry.length > 0) {    gpsPoint = projectedGeometry[0];   }  });

But that gives the error:

Uncaught TypeError: Cannot read property 'query' of undefined

No idea where that's coming from! I've checked the projectParams object and both the geometry and outSR look fine. Can anyone tell what I'm doing wrong here, or what a better method might be?

Many thanks

[JasonZou]

I would reproject the gpsPoint after set its lat/lon. The code will look like this.

if (navigator.geolocation) {
 navigator.geolocation.getCurrentPosition(function(location) {
  gpsPoint.setLatitude(location.coords.latitude);
  gpsPoint.setLongitude(location.coords.longitude);
  
                projectToMapCoords(gpsPoint);
        });
}

function projectToMapCoords(gpsPoint) {
    // Project gpsPoint to State Plane
    var projectParams = new esri.tasks.ProjectParameters();
    projectParams.geometries = [gpsPoint];
    projectParams.outSR = map.spatialReference;

    geometryService.project(projectParams, projectCallback);
}

function projectCallback(projectParams) {
        var newPoint;

 if (projectParams.length > 0) {
  newPoint= projectParams[0];
                gpsGraphic.setGeometry(newPoint);
         gpsGraphic.setSymbol(gpsSymbol);

          map.graphics.add(gpsGraphic);
         map.centerAndZoom(newPoint, 12);

         gpsIsOn = true; 
        }
}

The code assumes that map, gpsPoint, geometryService, gpsSymbol, and gpsIsOn are global variables. If not, change the code accordingly to apply the variable scope.

[RobertMartin2]

Thanks for the tip Jason, I dropped your code in but I'm still getting "Cannot read property 'query' of undefined" when it calls geometryService.project. I can't figure out for the life of me why there's a query here... I do have a couple of query tasks initiated but I'm not using them here. And yes, all the variables are globals so they should be visible throughout.

[JasonZou · Accepted solution]

Which JSAPI version are you using?

This is the excerpt of the api source for project method:

project : function(_1e, _1f, _20, _21) {  var _22 = _2.mixin({}, this._url.query, {   f : "json"  }), _23; ...

From the source, the error message means this._url is not defined. Check the code where geometryService is defined, making sure the correct url is fed into the constructor.

[RobertMartin2]

Well this is embarrassing... I thought GeometryService was a utility class that would do the projection locally. Now I see it wants a URL, so I tried the ArcGIS Online one and it works! Thanks for the snippet Jason, that was a big help.

I'm still wondering though, is this really the only way to add geometry with a different spatial reference? Seems like a lot of overhead for something so simple...

[JasonZou]

To be able to overlay a graphic onto a map with different spatial reference correctly, reproject has to be done. Either JASPI can take care of it for us, or else we have to handle that ourselves. To figure out whether JSAPI takes the responsibility, the best way is to look at the source. We can also try it out though.

But nevertheless, I do agree that since map and the graphic to be added both have the spatial reference provided, it will be better for the JSAPI to take care of the reproject for us.