Project Point using ArcGIS API for JavaScript?

Question

I've to project geometry point

Point(1657272, 6100874) with NZTM, WKID: 2193

But, point is shown near Austria, not on NewZealand maps. I've converted above coordinates to geographic, still its not giving correct results. Following is my code:

var mp = esri.geometry.webMercatorToGeographic(new esri.geometry.Point(1657272, 6100874, new esri.SpatialReference({ wkid: 2193 })));

map = new Map("mapDiv", center: [mp.x,mp.y], zoom: 5, basemap: "streets" });

on(map, "load", addGraphic);

function addGraphic() { map.graphics.add(new esri.Graphic(mp, new esri.symbol.SimpleMarkerSymbol().setColor(new dojo.Color([255, 0, 0, 0.5])) ) ) }

Please tell me what's wrong with above code and why it's not projecting point on correct area.

EDITED CODE

var map, gsvc;

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: [174.605369, -37.120276],
 zoom: 5
 });
 gsvc = new GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
 on(map, "load", projectToLatLong);
 function projectToLatLong() {
 map.graphics.clear();

 m_mapPoint = [];
 m_mapPoint[0] = new esri.geometry.Point(1657272, 6100874, new esri.SpatialReference({ wkid: 2193 }));
 var outSR = new SpatialReference(3857);
 var symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 20,
 new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
 new Color([255, 0, 0]), 2), new Color([0, 0, 0, 0])
 ) 
 var graphic = new Graphic(m_mapPoint, symbol);
 map.graphics.add(graphic);
 var params = new esri.tasks.ProjectParameters();
 // add array of points
 params.geometries = m_mapPoint;
 // Output Spatial Reference in lat/long (wkid 3857 ) 
 params.outSR = outSR;
 gsvc.project(params);
 }
 });
</script>

Please check updated code. Still point is not projecting.

• Dips: @PolyGeo : Sorry for putting up wrong title.
• PolyGeo: That's no problem. A title is never wrong but I think some titles can attract potential answerers to your question better than others - this Meta Q&A describes what we think and have found works best in more detail.

Answer 1

From https://developers.arcgis.com/javascript/jsapi/esri.geometry.webmercatorutils-amd.html#webmercatortogeographic:

Translates the given Web Mercator coordinates to Longitude and Latitude. By default the returned longitude is normalized so that it is within -180 and +180.

But your NZTM coordinates are not in webMercator units. You have to convert them from EPSG:2193 to EPSG:3857 to use this function.

• Dips: Do you mean to say that spatial reference wkid should be 3857 and not 2193? Please provide some sample code.
• AndreJ: See the answer to gis.stackexchange.com/questions/52914/utm-nad-1927-to-dms. I don't have access to Argis products.
• Dips: I've updated my code as per above sample, but still not working. Can you please check me and let me know where it is wrong.

Answer 2

In order to reproject non web-mercator coordinates inside a jsapi app, its necessary to call geometryService.project() which sends off a web request to a valid geometry service.

https://developers.arcgis.com/javascript/jsapi/geometryservice-amd.html#project

• Dips: I've projected point using geometry service, still not projecting point. Can you please have a look at edited code?
• Dips: I solved it. Below is the code

Answer 3

Its now projecting point. Thanks all of you for your help. Below is the updated code:

var map, gsvc;

 require([
 "esri/map", "esri/graphic", "esri/symbols/SimpleMarkerSymbol","esri/symbols/SimpleLineSymbol", "esri/Color",
 "esri/tasks/GeometryService", "esri/tasks/ProjectParameters",
 "esri/SpatialReference", "esri/InfoTemplate", "dojo/dom", "dojo/on",
 "dojo/domReady!"
 ], function(
 Map, Graphic, SimpleMarkerSymbol, SimpleLineSymbol, Color,
 GeometryService, ProjectParameters,
 SpatialReference, InfoTemplate, dom, on
 ) { 
 map = new Map("map", {
 basemap: "streets",
 center: [174.605369, -37.120276], 
 zoom: 5
 });
 gsvc = new GeometryService("http://tasks.arcgisonline.com/ArcGIS/rest/services/Geometry/GeometryServer");
 on(map, "load", projectToLatLong);
 function projectToLatLong() {
 map.graphics.clear();
 m_mapPoint = [];
 m_mapPoint[0] = new esri.geometry.Point(1657272, 6100874, new esri.SpatialReference({ wkid: 2193 }));
 var outSR = new SpatialReference(3857); 
 var params = new esri.tasks.ProjectParameters();
 // add array of points
 params.geometries = m_mapPoint;
 // Output Spatial Reference in lat/long (wkid 3857 ) 
 params.outSR = outSR;
 //gsvc.project(params, callback);
 gsvc.project(params, function callback(m_mapPoint) {
 pt = m_mapPoint[0]; 
 var symbol = new SimpleMarkerSymbol(SimpleMarkerSymbol.STYLE_CIRCLE, 20,
 new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID,
 new Color([255, 0, 0]), 2), new Color([0, 0, 0, 0])
 );
 var graphic = new esri.Graphic(pt, symbol); 
 map.graphics.add(graphic);
 });
 } 
 });

Thanks.